jQuery toggle()显示/隐藏文本的替代方法是什么?

时间:2013-09-12 19:02:01

标签: jquery

我正在尝试在表单中显示/隐藏具有特定.class的文本扩展名。通过选择具有正确.class的rodio,扩展应该显示。在表单中选择任何其他选项时,应该隐藏扩展名。我尝试使用jQuery toggle()函数,但是通过在任何一个无线电上再次点击,无论是否选择了扩展 - 再次显示或隐藏。

仅在选择了.class的广播时才会显示:

  

span class =“span_home_2”

我试过的toggle()是这样的:

jQuery的:

$(document).ready(function(){
    $("input").click(function(){
        $(".span_home_2").toggle();
    });
});

HTML:

<form class="banner_location_box">
    <label class="label_head">
        <?php echo $lang ['select_page']; ?>
    </label>
    <br/>
    <label class="select_page">
        <input type="radio" class="select_location" name="page_id" value="1" checked="checked"/>
        <span><?php echo $lang ['home']; ?><span class="span_home_2">(<?php echo $lang ['available_only']; ?>)</span></span>
    </label>
    <br/>
    <label class="select_page">
        <input type="radio" class="select_location" name="page_id" value="2"/>
        <span><?php echo $lang ['business']; ?></span>
    </label>
    <br/>
    <label class="select_page">
        <input type="radio" class="select_location" name="page_id" value="3"/>
        <span><?php echo $lang ['jobs']; ?></span>
    </label>
    <br/>
</form>

有更好的方法吗?

1 个答案:

答案 0 :(得分:1)

正如bmorgan21建议的那样,你想要更具体地了解你的逻辑。如果你可以将show和hide类分别添加到应该显示/隐藏元素的输入中,你可以这样做:

$("input.show").click(function () {
    $(".span_home_2").show();
});

$("input.hide").click(function () {
    $(".span_home_2").hide();
});

看看这个小提琴,看看这是不是你想要的:http://jsfiddle.net/2Wsns/