设置html表单的选择输入[重复]
Posted
技术标签:
【中文标题】设置html表单的选择输入[重复]【英文标题】:Set a select input of a html form [duplicate] 【发布时间】:2019-03-13 20:11:34 【问题描述】:我尝试从表单中选择特定的select
输入,我使用select2
库。 documentation 写道:
要以编程方式为 Select2 控件选择选项/项目,请使用 jQuery .val() 方法:
$('#mySelect2').val('1'); // Select the option with a value of '1'
所以,我尝试将输入设置为值0
。但是,输入没有改变......我错过了什么?
$('.js-example-basic-single').select2(
allowClear: true
);
var myFlag = 0;
$("#haslabel").val(myFlag);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css" rel="stylesheet" />
<div class="row">
<div class="col-md-12 col-sm-12">
<form id="form1" class="form-horizontal" role="form">
<fieldset>
<div class="form-group">
<div class="col-sm-12">
<select class="js-example-basic-single js-states form-control" id="hasLabel" name="hasLabel">
<option></option>
<option value="1">yes</option>
<option value="0">no</option>
</select>
</div>
</div>
</fieldset>
</form>
</div>
</div>
【问题讨论】:
【参考方案1】:-
正确拼写选择器
0 和 1 分别为假和真 - 使用字符串
val("0") 设置值但不显示它,除非您触发更改才能看到它
或者选择选项
<option value="0" selected>no</option>
注意:要看不到...
,您的选择必须足够宽
$(function()
$('#hasLabel').select2(allowClear: true);
$('#hasLabel').val("0").trigger("change"); // set AND show
);
.js-states width:70px
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.full.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css" />
<div class="row">
<div class="col-md-12 col-sm-12">
<form id="form1" class="form-horizontal" role="form">
<fieldset>
<div class="form-group">
<div class="col-sm-12">
<select class="js-example-basic-single js-states form-control" id="hasLabel" name="hasLabel">
<option></option>
<option value="1">yes</option>
<option value="0">no</option>
</select>
</div>
</div>
</fieldset>
</form>
</div>
</div>
【讨论】:
感谢您的信息!但是,我刚刚注意到我的实现又出现了一个错误。我没有选择hasLabel
,而是选择了haslabel
...
这也无济于事:)【参考方案2】:
我一直在阅读您提供的文件,我注意到的是:
Select2 将监听元素上的 change 事件 它附在。当您进行任何需要的外部更改时 反映在 Select2 中(比如改变值),应该触发 本次活动。
这意味着当你以编程方式设置一个值时,你需要手动触发'更改',所以像
$("#haslabel").val(myFlag).trigger("change");
【讨论】:
我打败了你。我花了太长时间才找到那个以上是关于设置html表单的选择输入[重复]的主要内容,如果未能解决你的问题,请参考以下文章