5

私はまだJavascriptをあまり知りません。誰かが私の問題を解決する方法を理解するのを手伝ってくれることを望んでいました:

私の HTML フォームには がありcheckbox、次にtextarea:

<form>
<input type="checkbox" name="detailsgiven" />
<textarea name="details"></textarea>
</form>

ユーザーがクリックしてテキストを入力できないように、 がチェックされているtextareaときに が無効になるようにします。checkbox

私はこことグーグルを見てきましたが、それを行う方法の明確な例は見つかりませんでした.

これは Javascript で実行できると思いますが、少し理解できません。できればサードパーティのライブラリを使用せずに、誰かがこれを行う方法を説明できますか?

4

6 に答える 6

8
<form>
<input type="checkbox" name="detailsgiven" onchange="toggleDisabled(this.checked)"/>
<textarea name="details" id="tb1"></textarea>
</form>

<script>
function toggleDisabled(_checked) {
    document.getElementById('tb1').disabled = _checked ? true : false;
}
</script>
于 2012-09-12T10:22:32.760 に答える
0

これは jQuery を使用すると非常に簡単に実行できます。誰もが jQuery を使用しているので、あなたもそうすべきです ;-)。

<form>
    <input type="checkbox" name="detailsgiven" id="detailsgiven" />
    <textarea name="details" id="details"></textarea>
</form>

<script type="text/javascript">
jQuery(document).ready(function($) {
    $("#detailsgiven").change(function() {
        if($(this).is(":checked")) {                
            $("#details").attr("disabled", "disabled");
        }
        else {
            $("#details").removeAttr("disabled");
        }
    });
});
</script>
于 2012-09-12T10:25:19.283 に答える
0

これを試して:

if ($('input:checkbox').is(':checked')) {
    $('textarea').attr('disabled', 'disabled');
}
于 2012-09-12T10:25:20.457 に答える
0
<form>
<input type="checkbox" name="detailsgiven" onclick="document.getElementById('t').setAttribute('disabled','disabled');" />
<textarea id="t" name="details"></textarea>
</form>

onclickチェックボックスのイベントを使用して JavaScript コードを実行する方法に注目してください。

getElementByIdHTML 要素に ID を指定すると、javascript DOM (ドキュメント オブジェクト モデル) のメソッドを介して JavaScript の要素にアクセスできます。

要素を取得したら、その属性を設定/取得したり、さまざまなことを実行したりできます。

于 2012-09-12T10:25:24.447 に答える
0

あなたがしなければならないのは、チェックボックスをマークするときだけで、テキストエリアに属性 disabled="disabled" を追加するだけです.

追加したjsfiddleをチェックアウトします

http://jsfiddle.net/Q9Lg4/

于 2012-09-12T10:20:51.577 に答える
0

あなたの要件に対する私の理解によると。最初は、テキストエリアは無効になっています。詳細指定のチェックボックスをチェックすると、テキストエリアが有効になり、チェックボックスが無効になり、変更できなくなります。このようにしてみてください。

<!DOCTYPE html>
<html>
<head>
<script>
function valueChanged()
{
    var element1 = document.getElementById("detailsgiven");
    var element2 = document.getElementById("details");
    if(element1.checked)
    {
        element2.disabled=false;
        element1.disabled="disabled";
    }
}

</script>
</head>
<body>
<form>
    <input type="checkbox" name="detailsgiven" id="detailsgiven" onchange="valueChanged()"/>
    <textarea name="details" id="details" disabled="true"></textarea>
</form>
</body>
</html>
于 2012-09-12T10:51:54.540 に答える