-1

jQuery内でremove/hidden関数を使用する方法を理解していますが、これは少し注意が必要です。

選択に基づいたifステートメントを含むドロップダウンがあります。選択が0(デフォルト)の場合、とのクラスを持つ日時テキストボックスの親divを削除する必要がsectionあり_100ます。

このようにして、フォーム内のその行のすべての部分が削除されます。明らかに、ユーザーが「いいえ」(値は0)を選択した場合は削除されたままになり、ユーザーが「はい」を選択した場合は、コメントの有効期限が切れる日時を入力できるように行全体が表示されます。

http://jsfiddle.net/ZMHkG

これについて何かアイデアはありますか?

4

1 に答える 1

1

私はあなたが提供したjsFiddleにいくつかの変更を加えました。これは、あなたが求めていたと思うことを実行します。更新されたバージョンはここにあります(以下のコード)。

.closest()jQuery関数を使用し<div>て、入力に関連して非表示にする要素への参照を取得しました#datetime。これは、直接の親ではないためです。

次に、型を変更せずに値を比較ifする演算子を使用するようにステートメントを変更し、比較対象の値をintではなく文字列に変更しました。==='0'0

else if実用的な目的を果たさないようだったので削除しました。値が'0';に等しい場合にのみ何かを実行したいのです。それが正しくない場合は、いつでもコードを少し変更してそれを行うことができます。


HTML:

<div class="section _100">
    <label for="comments">Allow Comments</label>
    <div>
        <select name="comments" id="comments">
            <option value="" selected="selected">Please Select An Option</option>
            <option value="0">No</option>
            <option value="1">Yes</option>
        </select>
    </div>
</div>
<div class="section _100">
    <label for="datetime">Date Comments Expire</label>
    <div>
        <input id="datetime" type="datetime" name="datetime" />
    </div>
</div>

jQuery:

var dt= $("#datetime");
var dtparent = dt.closest('div.section._100');

$('#comments').change(function(){

    if($(this).val()==='0'){
        dt.val(''); //empty value
        dt.prop('disabled', true);
        dtparent.hide();
    }
    else{        
        dtparent.show();
        dt.removeAttr('disabled');                    
        dt.attr('validation','true');
    }    
});
于 2012-04-14T18:49:52.117 に答える