Question

我正在使用jQuery Mobile，我有一个选择框，其中包含yes和no作为选项。我希望文本输入字段在选择“是”时显示，并在选择“否”时消失。

<fieldset data-role="controlgroup">
<label for="joint">Is this a joint gift?</label>
<select name="slider" id="joint" data-role="slider">
    <option value="no">No</option>
    <option value="yes">Yes</option>
</select> 
<div id="enter_joint">
    <label for="other_joint">Spouse Name:</label>
    <input name="other_joint" id="other_joint" value="" data-theme="d" />
</div>
</fieldset>

我想使用jQuery仅在select设置为Yes时才显示#enter_joint。

Answer 1

$('#enter_joint').hide();
$('#joint').change(function(){
    $('#enter_joint').toggle('show');
});

http://jsfiddle.net/aNrea/4/

Answer 2

AlienWebguy的答案会奏效，但我倾向于“检查价值”。所以这里有更多检查值，然后确定是否隐藏文本字段。

$(document).ready(function() {
    $("#enter_joint").hide();
    $("#joint").val('no');
    $("#joint").change(function() {
        if ($(this).val() == 'yes') {
            $("#enter_joint").show();
        } else {
            $("#enter_joint").hide();
        }
    });
});

jsfiddle

Answer 3

$(document).ready(function(){
    $('#enter_joint').hide();
    $('#joint').change(function(){
        val = $(this).val();

        if(val == 'yes')
        {
            $('#enter_joint').show();
        }

        if(val == 'no')
        {
            $('#enter_joint').hide();
        }
    });
});

Answer 4

试试这个

$('#joint').change(function(event) { 
    if($('#joint').val() === 'yes') { 
        $('#enter_joint').hide(); } 
    else { $('#enter_joint').show();
          }
});

Answer 5

备用语法：

$('#enter_joint').hide();
$('#joint').change(function(){
    show = $(this).val() == 'yes';
    $('#enter_joint').toggle(show);
});

选择使用jQuery显示文本输入

5 个答案: