[英]Select multiple values in a multiple select box with Jquery
所以我有兩個這樣的多個 select 盒子
<select id="foo" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>
<select id="bar" multiple="multiple">
<option value="1">Opt 1</option>
<option value="2">Opt 2</option>
<option value="3">Opt 3</option>
<option value="4">Opt 4</option>
</select>
<a href="#" onclick="select()">Select</a>
我想要做的是,當單擊“選擇”時,將選擇“#bar”中與“#foo”中的選項具有相同值的任何選項。 在這種情況下,應選擇“#bar”中的 Opt 1 和 Opt 2。 我不知道為什么我的 javascript 不起作用。 我知道這一定很簡單。 我只是看不到它。 :( 所以我的 Javascript function 如下:
function select(){
var vals = new Array();
var iter = 0;
$("#foo option").each(function(){
var v = $(this).val();
$('#bar option').each(function(){
if ($(this).val() == v)
{
vals[iter] = v;
iter++;
break;
}
});
});
$("#bar").val(vals);
}
檢查這個http://jsfiddle.net/NtF8J/
html
<select multiple>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
</select>
<select multiple>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
</select>
<button> random </button>
jquery
$(function(){
$(document.body).delegate(
'select:first', 'change', function(){
$('select:not(:first)').val(
$(this).val()
)
}
)
.delegate(
'button', 'click', function(){
$('select').val([1,2,3,4].filter(function(){return!!Math.round(Math.random() * 1)}))
}
)
});
看到 KON 的例子后更新
$("#sel").click(function(e) {
e.preventDefault(); // cancel the link itself
$("#bar").val($("#foo").val());
});
<a href="#" id="sel">Select</a>
使用每個的舊示例
$("#sel").click(function(e) { // when link clicked
e.preventDefault();
$("#foo option:selected ").each(function(){
var v = $(this).attr("value"); // first select's value
$('#bar option').each(function(){
if ($(this).attr("value") == v) {
$(this).attr("selected",true); // select if same value
}
});
});
})
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.