-1

チェックボックスボタンがチェックされているときに、入力のタイプを非表示からテキストに変更するための最良の方法は何でしょうか。

私はこのようなものを探しています

   <div class="options">
     <input type="checkbox" checked="">
   </div>

    <form>
        <input type="hidden">
    </form>

次に、チェックボックスが1つチェックされます

   <div class="options">
     <input type="checkbox" checked="checked">
   </div>

    <form>
        <input type="text">
    </form>
4

2 に答える 2

2

楽しみのために、私はこのようにしました：

$(document).ready(function () {
    $("#txt").toggle();
    $("#chk").change(function () {
        $("#txt").toggle();
    });
});

<input type="checkbox" id="chk" />
<input type="text" id="txt" />

非表示からテキストに変更する代わりに、1 つの入力要素の可視性を切り替えるだけです。もちろん、これは非表示から始まり、チェックすると表示され、チェックを外すと表示されなくなります。別の動作が必要な場合は、いくつかの小さな作業を行う必要がありますが、それを処理するのに十分賢いと確信しています。

幸運を！！

于 2013-03-24T00:10:47.450 に答える
0

このライブjsfiddleをチェックしてください

HTML：

<input type="checkbox" class="check1">Show checkbox</input>
<input type="hidden" class="hidden1" value="Some Value" />
<input type="text" class="text1" style="display:none" />

JQUERY：

$(".check1").click(function () {
    if ($('.check1').is(':checked')) {
        $(".text1").val($(".hidden1").val());
        $(".text1").show();
    } else {
        $(".text1").val("");
        $(".text1").hide();
    }
});


あなたが投稿したコードに基づいて、これはあなたが探しているものです：

$('.options input[type='checkbox']').click(function () {
    if ($('.options input[type='checkbox']').is(':checked')) {
        $('form').html("<input type='text'>");
    } else {
        $('form').html("<input type='hidden'>");
    }
});

しかし、私はあなたがそれをしたい理由を使いません。テキストボックスを表示および非表示にしようとしているだけですか？その場合、次のように書くことができます。

$('.options input[type='checkbox']').click(function () {
    $('input[type='text']').toggle();
});
于 2013-03-23T23:59:53.130 に答える