Question

如何在textarea中触发click事件？

我试过了：

jquery的

$(document).ready(function(){
$('#txtid').val('something');
$('#txtid').trigger('click');
});

HTML

<textarea id='txtid' rows='5' cols='20'></teaxtarea>

但是没有发生点击。代码有什么问题。

我尝试了像这样的焦点事件

   $('#txtid').focus(); //this worked

但我需要在将值传递给textarea之后触发click事件。

请帮助..

Answer 1

您必须先设置点击事件处理程序。

编辑1：由于您尝试在文档就绪中触发click事件，因此您必须在文档就绪事件处理程序中声明click事件处理程序，甚至在触发它之前。

HTML：

<textarea id='txtid' rows='5' cols='20'></textarea>

jQuery的：

$(document).ready(function(){
  $('#txtid').click(function() { alert('clicked'); }); 
  $('#txtid').val('something');
  $('#txtid').trigger('click');
});

小提琴： http://jsfiddle.net/j03n46bf/

编辑2：

由于您希望在获得textarea的值后触发事件， Milind Anantwar 是正确的，您必须使用onchange事件：

相同的Html，不同的jQuery：

$(document).ready(function(){
  $('#txtid').change(function() { alert('Value changed'); }); 
  $('#txtid').val('something');
  $('#txtid').trigger('change');
});

小提琴：http://jsfiddle.net/sb2pohan/

编辑3：

经过一番评论后：

$(document).ready(function(){
  $('#txtid').click(function() { changeDiv(); }); 
  $('#txtid').focus(); // Set Focus on Textarea (now caret appears)
  $('#txtid').val('something'); // Fill content (caret will be moved to the end of value)
  $('#txtid').trigger('click'); // Click Handler will be executed
});

function changeDiv() {
// do some stuff;
}

编辑4：使用test.html（在IE，FF，Chrome中测试）：

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                $("#txtid").click(function() { changeDiv(); });
                $("#txtid").focus();
                $("#txtid").val("value");
                $("#txtid").trigger("click");
            });
            function changeDiv() {
                $('#changeDiv').css("background-color","red");
                $('#changeDiv').html("changed content");
            }
        </script>
    </head>
    <body>
        <textarea id="txtid"></textarea>
        <div id="changeDiv" style="background-color: green; width: 100px; height: 100px;">start content</div>
    </body>
</html>

Answer 2

您可能需要触发更改事件：

 $('#txtid').trigger('change');

Answer 3

正如documentation所说，事件点击/更改需要退出，因此您的Javascrtipt应该是：

$(document).ready(function(){
$('#txtid').val('something');
  $('#txtid').on('change', function(){
    alert('hi!!!!!');
  })
$('#txtid').trigger('change');  
});

LIVE DEMO

Answer 4

要查看它是否有效，请首先定义单击侦听器，然后触发click事件。

http://jsfiddle.net/gfkjs5ps/

$(document).ready(function(){
  $('#txtid').val('something');
  $('#txtid').click(function(){alert("clicked");}); //define click listener
  $('#txtid').click();    //click text area
});

Answer 5

许多解决方案在几年前就已经足够了，但是HTML5的MAXLENGTH属性适用于我测试过的每种浏览器。它可以通过鼠标或键盘按下/向上和粘贴来使用。键入时，它也不会给您消失的最终字符。不需要JavaScript。

Answer 6

简单$('#txtid').click();将触发点击事件。

如何在textarea中触发click事件？

6 个答案: