Question

我做了这个jsfiddle：http://jsfiddle.net/6tZmc/1/

基本上，我想基于单选按钮选择更新空跨度。这是代码：

HTML

<div>
<p>Your chose: <span id="animal"></span></p>
</div>
<div>
<h2>Pick an Animal:</h2>
<input type="radio" name="pets" value="cat" />Cats<br />
<input type="radio" name="pets" value="dog" />Dogs
</div>

的jQuery ：

function petChoice(){
    var chosenPet = $('input[name="pets"]:checked').val();
    if(chosenPet = 'cat'){
        $("span#animal").text();
        $("span#animal").text("Cats");
    }else if (chosenPet = 'dog'){
        $("span#animal").text();
        $("span#animal").text("Dogs");
    }else{
        $("span#animal").text();
    }
}
$("input[name='pets']").click(function(){
    petChoice();
});

提前致谢

Answer 1

在if语句中，您试图将cats和dogs分配给chosenPet，实际上，您希望测试相等性。将=更改为==

Answer 2

不要忘记将函数包装起来，以便在document准备就绪后执行。

您也可以通过将文本设置为单击的单选按钮的值来缩短功能。在jQuery事件中，this指的是触发事件的元素。

$(function () {
    $("input[name='pets']").click(function () {
        $("#animal").text($(this).val());
    });
});

工作fiddle。

Answer 3

function petChoice(){
    var chosenPet = $('input[name="pets"]:checked').val();
    if(chosenPet == 'cat'){
        $("span#animal").html("Cats");
    }else if (chosenPet == 'dog'){
        $("span#animal").html("Dogs");
    }else{
        $("span#animal").empty();
    }
}
$("input[name='pets']").click(function(){
    petChoice();
});

jsfiddle：http://jsfiddle.net/6tZmc/4/

基于单选按钮选择更新跨度

3 个答案: