1

我正在向表中添加一行。在该行中的一个单元格中是一个我想要进行 ajax 调用的输入。但是，我在传递输入值时遇到问题。

我在这里说明了这个问题：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <script language="javascript">
      function addElement(){
        var id = 0;
        var tbl = document.getElementById('myTable');
        var rowInd = document.getElementById('row1').rowIndex;
        rowInd++;
        var row0 = tbl.insertRow( rowInd );
        var cell = row0.insertCell(0);
        //	cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup="alert( '+this.value+' );" />';
        // acts as expected:  hello world
        //	cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup="makeAjaxRequest( \'value='+this.value+'\' )" />';
        // Outputs:  value=undefined
        var theId = "myInput"+id;
        //	cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup="makeAjaxRequest( \'value='+document.getElementById( theId ).value+'\' )" />';
        // Output:  Object required
        cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup=" function(){ makeAjaxRequest( \'value='+this.value+'\' ) }" />';
        // Nothing happens
      }

      function makeAjaxRequest( val ){
        alert( val );
      }
    </script>
  </head>

  <body>
    <span onclick="addElement()">
      Click me
    </span>
    <br /><br />
    <table id="myTable">
      <tr id="row1"><td>hello</td></tr>
    </table>
  </body>
</html>

它直接进行 ajax 调用，因此我需要能够访问对象或值，以便进行搜索。任何帮助表示赞赏。

4

2 回答 2

0

您可以像这样传递值：-

  urlData = "" ;
    postData = "vendorType=" + jQuery('#EnrollmentRoleId').val() + "&time=" + new Date().getTime();

    jQuery.ajax({
        url: urlData,
        data: postData,
        success: function(data) {
            //alert(data);
            jQuery('#EnrollmentVendorId').html(data);
            jQuery('#user_id_div').show();
            jQuery('#loading_image').hide();
        }
    });
于 2012-04-10T07:14:18.413 回答
0

感谢您让我发现了 insertRow、rowIndex 和 insertCell！

顺便说一句，你白白地让你的生活复杂化。

cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup=" function(){ makeAjaxRequest( \'value='+this.value+'\' ) }" />';

这是正确的方法（DOM兼容，没有innerHTML evil，blablabla）：

var input = document.createElement('input')
input.type = 'text'
input.id = 'myInput' + id
input.value = 'hello world'
input.onkeyup = function() {
    makeAjaxRequest(this.value) // this is how to make it work
}
cell.appendChild(input) // or use replaceChild depending on your needs

通过时的问题'value=' + this.value是您传递了以下值：value=hello world.

另一个问题是，对于内联事件处理程序（如onkeyupHTML 中的），您不需要包装函数。以下将起作用：

cell.innerHTML = '<input type="text" id="myInput'+id+'" value="hello world" onkeyup="makeAjaxRequest( this.value );" />';

我没有测试过，但我怀疑通过包装另一个函数，这this是不同的。因此它为什么不能工作。

为避免歧义，请勿使用 HTML 事件处理程序。

于 2012-04-10T08:37:42.727 回答