将文本和选项移动到输入html和jquery中
将文本和选项移动到输入html和jquery中
提问于 2018-07-22 08:25:53
我正在开发一个chrome扩展，其中一个人指定了他想要的项目，颜色，大小和其他特定的选项；其中一些选项包括滑块和单选按钮以及选择选项。
然后，他按下add按钮，所有这些信息都被输入到一个大框中，然后用这些指定的信息创建一个输入，就像这个例子一样。
我怎么能做这样的事。这是我的html。
<!DOCTYPE html>
<html>
<head>
<title>HP</title>
<head>
<link rel="stylesheet" href="items.css">
<body>
<div class="bg">
<button id="droplist-btn" class="droplist-btn">Add By Droplist</button>
<!-- ADD ARROW IMAGE THAT POINTS TO THE RIGHT AND WHEN CLICKED ROTATES THE IMAGE TO POINT DOWNWARDS -->
<input type="text" id="item-code-input" class="item-code-input" placeholder=""></input>
<button type="submit" id="add-item-code" class="add-item-code">+</button>
<select type="text" id="sizes-item-code" class="sizes-item-code">
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XLarge">XLarge</option>
<option value="One Size">One Size</option>
</select>
<input type="radio" id="item-code-radio" class="item-code-radio" name="item-radio" checked="checked" />
<label for="item-code-radio">Item Code</label><br/>
<input type="radio" id="keyword-radio" class="keyword-radio" name="item-radio" checked="checked" />
<label for="keyword-radio">Keyword</label>
</div>
<script src="jquery.js"></script>
<script src="items.js"></script>
</body>
</html>任何帮助都将不胜感激谢谢。
回答 1
Stack Overflow用户
发布于 2018-07-22 09:28:08
jQuery中的控件通常使用val方法来设置其value。某些控件(如radio button )需要prop方法并将checked设置为true。
有关设置输入和选择的值，请参阅以下代码
$(document).ready(function(){
$("input#item-code-input").val("06453");
$("select#sizes-item-code").val("XLarge");
$("input#item-code-radio").prop("checked", true);
$("input#keyword-radio").prop("checked", false);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="item-code-input" class="item-code-input" placeholder=""></input>
<button type="submit" id="add-item-code" class="add-item-code">+</button>
<select type="text" id="sizes-item-code" class="sizes-item-code">
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="XLarge">XLarge</option>
<option value="One Size">One Size</option>
</select>
<input type="radio" id="item-code-radio" class="item-code-radio" name="item-radio" checked="checked" />
<input type="radio" id="keyword-radio" class="keyword-radio" name="item-radio" checked="checked" />
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51461078
复制相关文章
相似问题
腾讯云开发者
