如何使用jQuery和’this’来捕获更改的表单元素值
我有以下代码，每次在我的Web表单中发生元素更改时都会起作用：
我一直在努力的是如何在触发更改事件时捕获表单字段元素 id ， 名称和更改的值 。
任何人都可以帮我解决这个问题吗？
谢谢！
** JAVASCRIPT文件**
// Sarfraz $(this).change(function(){ var id, name, value; id = this.id, name = this.name, value = this.value; alert('id=' + id); // this returns 'undefined' alert('name=' + name); // this returns 'undefined' alert('value=' + value); // this returns 'undefined' }); // // rjz $(this).change(function(){ var $this = $(this), id = $this.attr('id'), name = $this.attr('name'), value = $this.val(); alert(id); // this returns 'undefined' alert(name); // this returns 'undefined' alert(value); // this returns blank }); // Jamie $(this).change(function(){ var id = $(this).attr('id'); var name = $(this).attr('name'); var value = $(this).attr('value'); alert('id=' + id); // this returns 'undefined' alert('name=' + name); // this returns 'undefined' alert('value=' + value); // this returns 'undefined' }); // //James Allardice $(this).change(function(e) { var elem = e.target; alert('elem=' + elem); // this returns 'objectHTMLTextAreaElement' }); // // Surreal Dreams $("#my-form input").change(function(){ alert('form element changed!'); var value = $(this).val(); var id = $(this).attr("id"); var name = $(this).attr("name"); alert(id); // nothing happens alert(name); // nothing happens alert(value); // nothing happens }); // //Jamie - Second Try $('.jamie2').each(function() { $(this).change(function(){ var id = $(this).attr('id'); alert(id); // nothing happens }); }); //
据我所知， this是指一个form元素，你想获得对该form元素的后代的引用，该元素触发了该事件。
如果这是正确的，您可以使用事件对象的target属性：
$(this).change(function(e) { var elem = e.target; });
这是一个有效的例子 。
在上面的代码中， elem将引用触发事件的元素。 然后，您可以访问该元素的属性，例如id ：
$(this).change(function(e) { var elemId = e.target.id; });
我想你从一开始就可能遇到问题：
$("#myform input").change(function(){ alert('form element changed!'); var value = $(this).val(); var id = $(this).attr("id"); var name = $(this).attr("name"); });
你不想从$（this）开始，你需要选择你想要监控的输入。 然后你可以在change（）函数中使用$（this）。
James Allardice指出，您可能使用$（this）引用该表单，而change（）事件将捕获表单中的所有更改。 我建议您更具体地定位更改的元素，这样您就不会在不需要或不想要的元素上捕获更改事件，这可能会消除意外行为。 您可以使用类或表单选择器来定位它们，例如:input 。
要使用$（this），您必须拥有预定义的JavaScript对象。 这就是为什么它被称为这个 。
所以你需要做这样的事情：
$('.class_name').each(function() { $(this).change(function(){ var id = $(this).attr('id'); }); });
要么
$('.class_name').click(function() { $(this).change(function(){ var id = $(this).attr('id'); }); });
简而言之，您需要先选择一个元素并创建一个对象，然后才能使用$（this）。
您可以在更改中执行以下操作
var ELEMEMT = $('#IDOFELEMENT').val();
您可以直接访问属性，如下所示：
$(this).change(function(){ var id = this.id, name = this.name, value = this.value; });
或者，jQuery提供帮助函数从jQuery集合中的第一个元素检索这些属性：
$(this).change(function(){ var $this = $(this), id = $this.attr('id'), name = $this.attr('name'), value = $this.val(); });
方法如下：
$(this).change(function(){ var id, name, value; id = this.id; name = this.name; value = this.value; });
尝试使用jQuery 1.7
$(document).on('change','#myID',function(){ alert('Id:'+this.id+'\nName:'+this.name+'\nValue:'+this.value); });
DEMO
好吧，除了评论forms，我迟到了派对，但仅仅是为了后人：这是我对超现实梦想的延伸：
$("#myform").on('change', input, (function(){ alert('form element changed!'); var $this = $(this); var value = $this.val(); var id = $this.attr("id"); var name = $this.attr("name"); });
#myform侦听内部输入的变化。 我也缓存了jQuery包装的this 。 瞧！