1

我需要尝试选择下拉列表,当我选中复选框值时,在下拉列表中选择了相应的值

例如,当我检查测试 2 时,下拉列表还将所选值更改为测试 2

我需要复选框组代码..

<html>
<head><title>Check Box</title>
<script>
$("#chk").click(function(){
$("#test option:selected")=$("#chk :checked").val()
});
</script>
</head>
<form>
<input type="checkbox" value="1" id="chk">Test 1
<input type="checkbox" value="2" id="chk">Test 2
<input type="checkbox" value="3" id="chk">Test 3
<select id="test">
<option value="1">Test 1</option>
<option value="2">Test 2</option>
<option value="3">Test 3</option>
</select>
</form>
</html>
4

3 回答 3

2

HTML

<form>
  <input type="checkbox" value="1" id="chk1">Test 1
  <input type="checkbox" value="2" id="chk2">Test 2
  <input type="checkbox" value="3" id="chk3">Test 3
  <select id="test">
    <option value="1">Test 1</option>
    <option value="2">Test 2</option>
    <option value="3">Test 3</option>
  </select>
</form>

jQuery

$(':checkbox').change(function() {
    // uncheck previously checked checkbox
    // becasue select can show one value
    // at a time

    $(':checkbox:checked') // select all checked checkbox
           .not(this)  // escape the current checkbox
           .prop('checked', false); // making uncheck

    // change the select box value

    $('#test').val(this.value);

});

您的代码中的问题:

  • type="checbox"应该type="checkbox"

  • 不要id对所有人都使用相同的checkbox

演示

于 2012-05-29T11:40:24.150 回答
1
$("#chk").click(function(){
    if( $(this).is(':checked') )  // or   if( $(this).attr('checked')== true) )
    $("#test").attr('value', $(this).attr('value'));

});
于 2012-05-29T11:57:49.290 回答
0

工作演示 http://jsfiddle.net/EZEQu/

很少有事情是错的。该演示是基本演示,您可以玩耍和增强。

  • HTMLtype=checkbox

  • id 需要一直是唯一的

  • <script>标签也值得将type属性放入其中。

希望这可以帮助,

代码

$('input[type="checkbox"]').click(function(){

    if ($(this).is(':checked'))
        $("#test").val($(this).val());
});​

HTML

<html>
<head><title>Check Box</title>

</head>
<form>
<input type="checkbox" value="1" id="chk">Test 1
<input type="checkbox" value="2" id="chk1">Test 2
<input type="checkbox" value="3" id="chk2">Test 3
<select id="test">
<option value="1">Test 1</option>
<option value="2">Test 2</option>
<option value="3">Test 3</option>
</select>
</form>
</html>​
于 2012-05-29T11:48:22.803 回答