检查单选按钮是否

时间:2016-12-19 15:47:36

标签: javascript jquery

我想根据输入字段选择一个单选按钮。这似乎很简单,但它不起作用。基本上用户填写表格,并根据州输入字段,选择州税单选按钮。

下面的代码由于某种原因没有解雇,任何想法都是?

输入字段

<div class="form-group">
 <label for="state" class="col-sm-3 control-label">State</label>
  <div class="col-sm-9">
    <input type="text" class="form-control" id="state" name="state" placeholder="State" onblur="picktax();" required />
  </div>
</div>

单选按钮

<div class="form-group">
<label for="emailaddress" class="col-sm-3 control-label">Tax</label>
<div class="col-sm-9">
    <br>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio1" class="radio" value="0" / />
            <span class="lbl">Tax Exempt</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio2" class="radio" value="0.0875" />
            <span class="lbl">NYC 8.875%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio3" class="radio" value="0.08625" />
            <span class="lbl">LI 8.625%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio4" class="radio" value="0.07" />
            <span class="lbl">NJ 7%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio5" class="radio" value="0.06" />
            <span class="lbl">Philly 6%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio6" class="radio" value="0.0635" />
            <span class="lbl">CT 6.35%</span>
        </label>
        <br>
    </div>
</div>

脚本

<script>
function picktax() {

var statevalue = document.getElementById('state').value;
var nyvalue = "NY";
var livalue = "LI";
var njvalue = "NJ";

if (statevalue == nyvalue) {

$("#radio2").prop("checked", true)

} elseif (statevalue == livalue) {

$("#radio3").prop("checked", true)

} elseif (statevalue == njvalue) {

$("#radio4").prop("checked", true)


} else {

 alert("test");
}

}
</script>

已更新,仍未解雇

2 个答案:

答案 0 :(得分:0)

正如评论中所指出的,您的代码存在一些语法错误。此外,还有一些方法可以改进它,例如我使用switch代替ifif没有错,我只是举个例子。固定代码为:

function picktax() {

    var statevalue = $('#state').val();
    var radio = $();

    switch (statevalue) {
        case "NY":
            radio = $("#radio2");
            break;
        case "LI":
            radio = $("#radio3");
            break;
        case "NJ":
            radio = $("#radio4");
            break;
        default:
            alert("test");
            break;
    }

    radio.prop("checked", true);
}

答案 1 :(得分:0)

您的示例显示您不熟悉JavaScript,因此我自己也不会对此进行编码,因此您的代码已得到纠正,可以正常工作。

正如评论中所提到的,JS中没有elseif关键字,您必须使用double或triple equals运算符进行评估。

尽管如此,你已经接近可行的事情了。

function picktax() {

var statevalue = document.getElementById('state').value;
var nyvalue = "NY";
var livalue = "LI";
var njvalue = "NJ";

if (statevalue == nyvalue) {

$("#radio2").prop("checked", true)

} else if (statevalue == livalue) {

$("#radio3").prop("checked", true)

} else if (statevalue == njvalue) {

$("#radio4").prop("checked", true)

} else {

 alert("test");
}

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
 <label for="state" class="col-sm-3 control-label">State</label>
  <div class="col-sm-9">
    <input type="text" class="form-control" id="state" name="state" placeholder="State" oninput="picktax();" required />
  </div>
</div>

<div class="form-group">
<label for="emailaddress" class="col-sm-3 control-label">Tax</label>
<div class="col-sm-9">
    <br>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio1" class="radio" value="0" / />
            <span class="lbl">Tax Exempt</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio2" class="radio" value="0.0875" />
            <span class="lbl">NYC 8.875%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio3" class="radio" value="0.08625" />
            <span class="lbl">LI 8.625%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio4" class="radio" value="0.07" />
            <span class="lbl">NJ 7%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio5" class="radio" value="0.06" />
            <span class="lbl">Philly 6%</span>
        </label>
        <br>
    </div>
    <div class="col-sm-9">
        <label class="checkbox-inline">
            <input type="radio" class="px" name="tax2" id="radio6" class="radio" value="0.0635" />
            <span class="lbl">CT 6.35%</span>
        </label>
        <br>
    </div>
</div>