About select2 can not be set to display but can be set
I used select2 for project reasons, and I, Xiaobai, used traditional select to set it up, and then Baidu googled and groped for 2 days, and finally found it.
In order to facilitate the search, I will summarize and help the majority of netizens by the way.
html code
<select id="ddd"> <option value="one">First</option> <option value="two">Second (disabled)</option> <option value="three">Third</option> <option value="four">four1111111</option> <option value="five">five2222222222</option> <option value="six">six66666666</option> </select>
js code
var ddd = $("#ddd").select2(); //Get selectid
ddd.val("four").trigger("change"); //Set the option whose value is four to the selected state
Damn, I've been suspicious of select2 for so long after this simple act, and then I didn't do it. Alas, I won't say more about the sadness. Let's go and unrestrained your code! ! ! hee hee off work
ddd.change();//Tell select2 that the code has been updated and the default selection needs to be reloaded to be worth the first one
Here are the traditional options don't mislead
$("#select_id").change(function(){//code...}); //Add an event to Select, triggered when one of the items is selected
varcheckText=$("#select_id").find("option:selected").text();//Get the text selected by Select
varcheckValue=$("#select_id").val();//Get the Value selected by Select
varcheckIndex=$("#select_id ").get(0).selectedIndex;//Get the index value selected by Select
varmaxIndex=$("#select_id option:last").attr("index");//Get the maximum index value of Select
|
jQuery add/remove Select's Option item:
$("#select_id").append("<option value='Value'>Text</option>");//Append an Option (drop-down item) to Select
$("#select_id").prepend("<option value='0'>Please select</option>");//Insert an Option for Select (the first position)
$("#select_id option:last").remove();//Remove the Option with the largest index value in the Select (the last one)
$("#select_id option[index='0']").remove();//Remove Option with index value 0 in Select (the first one)
$("#select_id option[value='3']").remove();//Remove Optiona with Value='3' in Select
$("#select_id option[text='4']").remove();//Remove Optiona with Text='4' in Select
Content empty:
$("#charCity").empty();
Every time you operate select, you always have to come out and look at the information. It is better to summarize it yourself and turn it here in the future.
比如<select class="selector"></select>
1. Set the value of the item to pxx to be selected
$(".selector").val("pxx");
2. Set text to pxx item selection
$(".selector").find("option[text='pxx']").attr("selected",true);
Here is a usage of square brackets. The equal sign in square brackets is preceded by the attribute name without quotation marks. In many cases, the use of square brackets can make logic very simple.
3. Get the value of the currently selected item
$(".selector").val();
4. Get the text of the currently selected item
$(".selector").find("option:selected").text();
The colon is used here, and mastering its usage and inferring other things will also make the code more concise.
The cascade of selects is often used , that is, the value of the second select changes with the value selected by the first select. This is very simple in jquery.
Such as:
$(".selector1").change( function (){
// First clear the second one
$(".selector2").empty();
// In practical applications, the options here are generally generated by loops
var option = $("<option>").val(1).text("pxx");
$(".selector2").append(option);
});
jQuery gets the Text and Value selected by Select:
Syntax Explanation:
$("#select_id").change( function (){ // code...}); //Add an event for Select, trigger when one of them is selected
var checkText=$("#select_id").find( "option:selected").text(); // Get the Text selected by Select
var checkValue=$("#select_id").val(); // Get the Value selected by Select
var checkIndex=$("#select_id ") .get(0).selectedIndex; // Get the index value selected by Select
var maxIndex=$("#select_id option:last").attr("index"); // Get the largest index value of Select
jQuery sets the Text and Value selected by Select:
Syntax Explanation:
$("#select_id").change(function(){//code...}); //Add an event to Select, triggered when one of the items is selected
var checkText=$("#select_id").find("option:selected").text(); //Get the Text selected by Select
var checkValue=$("#select_id").val(); //Get the Value selected by Select
var checkIndex=$("#select_id ").get(0).selectedIndex; //Get the index value selected by Select
var maxIndex=$("#select_id option:last").attr("index"); //Get the maximum index value of Select
$("#select_id ").get(0).selectedIndex=1; // Set the item whose Select index value is 1 to select
$("#select_id ").val(4); // Set the Value of Select to 4 The item is selected
$("#select_id option[text='jQuery']").attr("selected", true ); // Set the Text value of Select to jQuery's item selection
jQuery add/remove the Option item of Select:
Syntax Explanation:
$("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
$("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option
$("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option
jquery radio取值，checkbox取值，select取值，radio选中，checkbox选中，select选中，及其相关
获 取一组radio被选中项的值
var item = $('input[name=items][checked]').val();
获 取select被选中项的文本
var item = $("select[name=items] option[selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[name=items]').get(1).checked = true;
获取值：
文本框，文本区域：$("#txt").attr("value")；
多选框 checkbox：$("#checkbox_id").attr("value")；
单选组radio： $("input[type=radio][checked]").val();
下拉框select： $('#sel').val();
控制表单元素：
文本框，文本区域：$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox： $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组 radio： $("input[type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框 select： $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty()；//清空下拉框