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

2018-06-06 05:14:05

我知道我的PHP，但我只有非常基础的JavaScript知识，可能是因为我尽量避免使用JavaScript，因为浏览器总是存在浏览器禁用JavaScript的风险......但是现在我需要一个特定的任务可能只能通过使用JavaScript解决的html表单。

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

我试图搜索指南和教程，涵盖了这一点，但一直没能找到解决方案（可能是因为我缺乏JavaScript技能，我可能没有使用正确的搜索条件）。

任何人对我有任何建议，我会很感激！

<!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 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 );
}());

应该做这项工作。

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()和其他方法做比这更好的事情。

但现在这可以帮助你。

希望能帮助到你。

链接地址: http://www.djcxy.com/p/19387.html

上一篇: Select checkbox when clicking in textarea (JavaScript?)

下一篇: Javascript/jQuery variable, what is the proper way to use a var?