Question

我知道我的PHP，但我只获得了非常基本的JavaScript知识，可能是因为我试图完全避免使用JavaScript，因为访问者在浏览器中一直存在禁用JavaScript的风险......但是现在我需要一定的html格式的任务，只能通过使用JavaScript来解决。

我有一个textarea和一个复选框。加载页面时默认选中该复选框。如果用户在textarea中单击，我希望自动取消选中该复选框。如果用户点击textarea之外的任何地方并且由于某种原因没有在textarea中写任何内容，我希望再次选中该复选框。

我曾尝试搜索涵盖此内容但未能找到解决方案的指南和教程（可能是因为我缺乏JavaScript技能，我可能没有使用正确的搜索字词。）

任何人对我有任何建议，我会很高兴！

Answer 1

考虑您的标记为

<textarea id="txtAr"></textarea>
<input type="checkbox" id="chkBx">

然后是js，

(function() {
    var oTxt = document.getElementById( 'txtAr' ),
        oChk = document.getElementById( 'ChkBx' );

    oTxt.addEventListener( 'click', function() {
        oChk.removeAttribute( 'checked' );
    }, false );
}());

应该做的工作。

Answer 2

Torbjörn。

首先，我建议你忘记使用Javascript的烦恼。想一想。如果用户在他的浏览器中禁用了js，他就不会使用任何网站..所以如果他想使用你的网站或任何其他网站，他就会启用它。

我们来看问题..

我会说最简单的方法......

<body onclick="if(document.getElementById('area').value == '') document.getElementById('chk').checked = false;">
    <form>
       <textarea id="area" onclick="document.getElementById('chk').checked = true"></textarea>
       <input type="checkbox" id="chk">
    <form>
</body>

我没有测试这个解决方案，但我认为它应该有效。例如，您可以使用.trim()和其他东西做更好的事情。

但是现在这可以帮助你。

希望它有所帮助。

Answer 3

<!DOCTYPE html>
<html>
<body>
<textarea id="iamtextarea" rows="4" cols="10" onfocus="onFocusTextArea();" onblur="onBlurTextArea();"></textarea>
<input type="checkbox" name="iamcheckbox"  id="iamcheckbox" checked="checked"> I am checkbox<br>
</body>
</html>

<script type="text/javascript">

function onFocusTextArea(){ 
 document.getElementById("iamcheckbox").checked = false;
}
function onBlurTextArea(){
  if(document.getElementById("iamtextarea").value==""){
  document.getElementById("iamcheckbox").checked = true;
  }
}
</script>

运行上面的代码，它将完成所需的工作！

Iinjoy！

现在你必须在onBlurTextArea函数中添加一个隐藏字段和一些更改，见下面的代码：

<html>
<body>
<textarea id="iamtextarea" rows="4" cols="10" onfocus="onFocusTextArea();" onblur="onBlurTextArea();">Enter some text in textbox</textarea>
<input type="checkbox" name="iamcheckbox"  id="iamcheckbox" checked="checked"> I am checkbox<br>
<input type="hidden" name="hiddenString" id="hiddenString" value="Enter some text in textbox">
</body>
</html>

<script type="text/javascript">

function onFocusTextArea(){ 
 document.getElementById("iamcheckbox").checked = false;
}
function onBlurTextArea(){
  if(document.getElementById("iamtextarea").value==document.getElementById("hiddenString").value){
  document.getElementById("iamcheckbox").checked = true;
  }
}
</script>

单击textarea时选择复选框（JavaScript？）

3 个答案: