Question

传递参数时，JavaScript不会调用函数。

我正在动态创建HTML。

checkbox2 = document.createElement("<input type=\"checkbox\"  name=\"wdrs_contact\" checked=\"Yes\" onclick =\"setPartnersInfo('\"+id+\"');\" />");

function setPartnersInfo(ch)
{
    alert(ch)
}

但是当我在函数调用中没有参数时，它正在工作。

详情如下：

function createPartnerTable() {

    var partnerInfo = document.getElementById("partnersInfo");
    var data = partnerInfo.value;

    // everything was successful so now come back and update, first clear the old attributes table
    var partnersBody = document.getElementById("partnersBody");
    var rowCount = partnersBody.rows.length;
    for( var i = 0; i < rowCount; i++ )
    {
        partnersBody.deleteRow(0);
    }

    if (data ==null || data.length==0)
        return;

    // now parse and insert each partner row
    //alert("data : "+data);
    var index = 0;
    var lastIndex = 0;
    while( index < data.length && index != -1 )
    {
        lastIndex = data.indexOf("|", index);
        if( lastIndex == -1 ){
            break;
        }

        var id = data.substring(index, lastIndex);

        index = lastIndex + 1;
        lastIndex = data.indexOf("|", index);
        var name = data.substring(index, lastIndex);

        index = lastIndex + 1;
        lastIndex = data.indexOf("|", index);
        var partnerType = data.substring(index, lastIndex);

        index = lastIndex + 1;
        lastIndex = data.indexOf("|", index);
        var status = data.substring(index, lastIndex);

        index = lastIndex + 1;
        lastIndex = data.indexOf(";", index);
        var jdeCode = data.substring(index, lastIndex);

        //ganessin
        index = lastIndex + 1;
        lastIndex = data.indexOf("#", index);
        var wdrsContact = data.substring(index, lastIndex);

        row = partnersBody.insertRow(partnersBody.rows.length);

        //check box with id for removal
        var checkboxCell = row.insertCell(0);
        checkboxCell.align="center";
        var checkbox = document.createElement('<input type="checkbox"  name="selectedPartnerIds" />');
        //var checkbox = document.createElement("input");
        //checkbox.type = 'checkbox';
        //checkbox.checked=false;
        //checkbox.name = 'selectedPartnerIds';
        checkbox.value=id;
        //checkbox.style.align = "center";
        //checkbox.style.width = '40%';
        checkboxCell.appendChild(checkbox);

        var check = document.getElementsByName('selectedPartnerIds');

        //Name
        var nameCell = row.insertCell(1);
        nameCell.appendChild(document.createTextNode(name));

        //Partner Type
        var partnerTypeCell = row.insertCell(2);
        partnerTypeCell.align="center";
        partnerTypeCell.appendChild(document.createTextNode(partnerType));

        //Status
        var statusCell = row.insertCell(3);
        statusCell.align="center";
        statusCell.appendChild(document.createTextNode(status));

        //JDE Code
        var jdeCodeCell = row.insertCell(4);
        jdeCodeCell.align="center";
        jdeCodeCell.appendChild(document.createTextNode(jdeCode));

        //ganessin
        var checkboxCell2 = row.insertCell(5);
        checkboxCell2.align="center";
        var checkbox2 = "";
        //alert("wdrsContact "+wdrsContact);
        var x = "setPartnersInfo("+id+")";
            alert("x = "+x);
        if(wdrsContact == "true")
        {
            alert("true");

            //checkbox2 = document.createElement('<input type="checkbox"  name="wdrs_contact" checked="Yes" onclick="+x+" onchange="+x+" />');
            checkbox2 = document.createElement("<input type=\"checkbox\"  name=\"wdrs_contact\" checked=\"Yes\" onclick =\"setPartnersInfo(\"+id+\");\" />");
            //String(document.createElement('<input type="checkbox"  name="wdrs_contact" checked="Yes" onchange="setPartnersInfo("+id+");"/>'))
        }
        else
        {
            alert("false");
            //checkbox2 = document.createElement('<input type="checkbox"  name="wdrs_contact" onclick="+x+" onchange="+x+" />');
            checkbox2 = document.createElement("<input type=\"checkbox\"  name=\"wdrs_contact\" onclick=\"setPartnersInfo(\"+id+\");\" />");
        }
        //alert("id "+id);
        //checkbox2.value=id;
       // alert("checkbox2 "+checkbox2);
        checkboxCell2.appendChild(checkbox2);

        // increment the index to process next
        index = lastIndex + 1;
    }

}

Answer 1

以下将生成语法错误：

"onclick =\"setPartnersInfo('\"+id+\"');\""

您应该使用：

"onclick =\"setPartnersInfo(\'"+id+"\');\""

或者，如果您的ID是数字（您不需要引号）：

"onclick =\"setPartnersInfo("+id+");\""

如果您希望在html属性中使用双引号，则必须将它们转换为"

所以以下内容也应该有效：

"onclick =\"setPartnersInfo(&quot;"+id+"&quot;);\""

虽然应该并不是正确的词，因为使用这样的事件监听器生成html并不是最好的方法。

总的来说，你的字符串应该是：

("<input type=\"checkbox\"  name=\"wdrs_contact\" checked=\"Yes\" onclick =\"setPartnersInfo('"+id+"');\" />");

虽然为了避免一直逃脱，但为什么不使用：

('<input type="checkbox"  name="wdrs_contact" checked="Yes" onclick ="setPartnersInfo(\''+id+'\');" />');

为了改善

实现您正在做的事情的更好方法是从您的标记中分离您的代码，并让浏览器生成您的标记，这更容易阅读并且往往更快 - 而且这意味着您不必非常担心逃避报价;）

checkbox2 = document.createElement('input');
checkbox2.type = 'checkbox';
checkbox2.name = 'wdrs_contact';
checkbox2.checked = 'checked';
checkbox2.onclick = function(){
  setPartnersInfo(id);
}

上面要注意的一个主要区别是，在将id var放入html字符串之前 - 它的当前值记录在该字符串中。使用上面的内容，对id变量的引用会记住，但不会记住值。如果在此之后的任何时候更改id的值，它仍然会随着引用而改变。要解决此问题，您可以使用closure。

这可以通过将id的值传递给函数来实现，该函数基本上会更改用于将id的值存储到stored_id的变量，然后此函数返回一个函数用作事件处理程序。此事件处理函数可以访问stored_id var，无论您更改id多少，stored_id都不会更改。这有点复杂，如果你不知道关闭，那么这是一个很好的主题。

checkbox2.onclick = (function(stored_id){
  return function(){setPartnersInfo(stored_id);};
})(id);

为了进一步改进上述内容，您应该避免使用内联事件处理程序，因此：

checkbox2 = document.createElement('input');
checkbox2.type = 'checkbox';
checkbox2.name = 'wdrs_contact';
checkbox2.checked = 'checked';
/// for modern browsers
if ( checkbox.addEventListener ) {
  checkbox.addEventListener('click', function(){
    setPartnersInfo('your id here');
  });
}
/// for old ie
else {
  checkbox.attachEvent('onclick', function(){
    setPartnersInfo('your id here');
  });
}

传递param时JavaScript不调用函数

1 个答案:

为了改善