Question

您好我一直在尝试将单选按钮设置为某些值，具体取决于选择的选择下拉菜单。

首先是select语句：

<select id="department" name="department" class="input-xlarge" onchange="setDefault();">
    <option value="" selected></option>
    <option value="1">Read Only</option>
    <option value="2">HR Staff</option>
    <option value="3">Select 3</option>
    <option value="4">Select 4</option>
    <option value="7">Select 5</option>
</select>

我创建了一个我认为允许我设置值的函数，取决于所选择的内容。

<script>
    function setDefault() {
    if (department.val() == '1'){
        alert('One');
    }
    $("#radio-0").prop("checked", true);
</script>

我认为如果部门的val（选择下拉列表）等于1则设置该值我在控制台窗口中收到的错误是
*Uncaught TypeError: undefined is not a function*

我知道这应该很简单，但作为一个jQuery新手我知道我可能犯了一个简单的错误。
总的来说，目标是根据下拉选择将一系列单选按钮设置为特定值。例如，如果选择了“只读”，则某些值将设置为1,2,3 4或5（对于单选按钮），依此类推，具体取决于下拉选项。

由于

Answer 1

使用jQuery onchange函数。

$(document).ready(function () {
$("#department").change(function () {
if(this.value=='1')
{
    alert("one");
}
  $("#radio-0").prop("checked", true);
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<select id="department" name="department" class="input-xlarge">
                  
  <option value="" selected></option>

  <option value="1">Read Only</option>

  <option value="2">HR Staff</option>

  <option value="3">Select 3</option>

  <option value="4">Select 4</option>

  <option value="7">Select 5</option>

</select>

<input type="radio" id="radio-0">

Answer 2

尝试

$('#department').on('change',function() {

    if ($(this).val() == '1') alert($(this).val())

})

http://jsfiddle.net/5x0h5g73/1/

Answer 3

我建议使用javascript。这是一个很小的请求，你真的不需要外部图书馆。

基于您的HTML，包括一些单选按钮

<select id="department" name="department" class="input-xlarge" onchange="setDefault(this);">
                  <option value="" selected></option>

                    <option value="1">Read Only</option>

                    <option value="2">HR Staff</option>

                    <option value="3">Select 3</option>

                    <option value="4">Select 4</option>

                    <option value="7">Select 5</option>

</select><br />

<input type="radio" name="selectedop" id="radio-1" /><br />
<input type="radio" name="selectedop" id="radio-2" /><br />
<input type="radio" name="selectedop" id="radio-3" /><br />
<input type="radio" name="selectedop" id="radio-4" /><br />
<input type="radio" name="selectedop" id="radio-7" />

然后你只需在脑海中添加这个javascript即可。它通过组合“radio-”和值来选择基于该值的无线电以产生id。

function setDefault(input) {
    document.getElementById("radio-" + input.value).checked = true;
}

JsFiddle示例：http://jsfiddle.net/bpmf3cks/

根据下拉选择更改单选按钮的值

3 个答案: