入力フィールドから入力フィールドを有効にする

Question

入力フィールドを有効にしてチェックボックスをオンにしたいとします。

は、私はここで基本的な形式があります。

<ul> 
<li> 
    <label id="form-title" for="name3">Specifics:</label> 
<li> 
    <textarea id="name3" name="name3" > 

    </textarea> 
</li> 

</ul> 

あなたが「細目をクリックし、それがフィールドをアクティブにし、これを代わりにラベル・タグのinputタグで行うことができます

例。？：これまでに完全な仕事の

<ul> 
<li> 
    <input type="checkbox" for="name2">Other...</input> 
    <input id="name2" name="name2" /> 
</li> 
</ul> 

jsfiddle：http://jsfiddle.net/Sederu/gaZDW/

Answer 1

それには少しのEMCAScriptが必要です。

<label for="name3"> 
    <input type="checkbox" id="name3activaitor" onclick="if(this.checked){ document.getElementById('name3').focus();}" /> 
    Other... 
</label> 
<input type="text" id="name3" name="name3" /> 

インラインハンドラは、チェックボックスがオンになっているかどうかをチェックし、チェックされている場合はテキスト入力をフォーカスします。私は同じ機能を実行するので、ラベルにチェックボックスを付けるだけで、それをラベルと一緒にシンプルにグループ化しますが、どこにでもチェックボックスを置くことができます。

あなたが有効/入力フィールドを無効にするだけではなく、それを集中するために探している場合は、inputタグには存在しないためにそう

 <input type="checkbox" onclick="var input = document.getElementById('name2'); if(this.checked){ input.disabled = false; input.focus();}else{input.disabled=true;}" />Other... 
     <input id="name2" name="name2" disabled="disabled"/> 

Answer 2

属性のように行うことができます。あなたの目的のために、インラインjavascriptのコードを使用して無効属性：

<input type="checkbox" id="checkbox1" onclick="if (this.checked){ document.getElementById('textarea1').removeAttribute('disabled');}" /> 
<textarea id="textarea1" name="textarea1" disabled></textarea> 

Answer 3

あなたは少しのJavaScriptでそれを行うことができ、

HTML

<ul> 
<li> 
    <input type="checkbox" id="checker" for="name2">Other...</input> 
    <input id="name2" name="name2" /> 
</li> 
</ul> 

JAVASCRIPT

document.getElementById('checker').onchange = function() { 
if(this.checked==true){ 
    document.getElementById("name2").disabled=false; 
    document.getElementById("name2").focus(); 
} 
else{ 
    document.getElementById("name2").disabled=true; 
} 
}; 

それは

Answer 4

他の回答のすべてが動作しますが、この1つはシンプルで役立つことを願っています::

<input type="checkbox" id="checkbox"><label class="checkbox" for="checkbox"> Remember Me! 

説明：

• <inputタグ呼び出しを定義します。
• type="checkbox"これを定義するのはチェックボックスです。
• id="checkbox"> "チェックボックス"として識別します。
• <label class="checkbox" "チェックボックス"として分類します。
• id： "checkbox"
• Remember Me!チェックボックスの横に表示される内容です。