Question

我正在开发一个网页，其中的表单是通过javascript（jquery）动态创建的。对于每个（重复的）表单元素集，添加显示/隐藏功能以显示和隐藏元素，并且我不会使这个显示/隐藏代码工作 - 我怀疑错误位于下面的代码中指示，我认为我很难将引号放在正确的位置（？）控制台指示错误“Uncaught SyntaxError：Unexpected token}”，我不明白;当排除可疑的错误行时，没有进一步的错误，我不知道这个“}”出现在哪里不应该出现。

Javascript代码：

function ShowHide(id) {
    $(id).toggle();
}


$(document).ready(function () {

    var buildform = function () {
        var form ='<div id="form">'

        for (var i = 0; i < 2; i++) {

            form += '<div id="filename"' + i + '> Document  </div> </td>';
            //error in next line (?)
            form += '<button onclick="ShowHide(\'#filename'+ i +'\')">  Show/hide document </button> </td> </tr>';

        } //for i
        form += '</div>'; //id="form"
        console.log('FORM: '+form);
        return
    } //buildform()

   $("#wrapper").append(form);

}); //$(document).

HTML code：

<div id="wrapper"></div>

javaconsole（）输出：

<div id="form"><div id="filename"0> Document  </div><button onclick="ShowHide('#filename0')">  Show/hide document </button></div><div id="filename"1> Document  </div><button onclick="ShowHide('#filename1')">  Show/hide document </button></div>

Answer 1

你的报价是错的。

  form += '<td> <button onclick="ShowHide(\'#filename'+ i +  '\')">  Show/hide document </button> </td> </tr>';

我在括号中匹配引号，并使用\转义它们。此外，您正在保存您创建的html，但从未显示它实际将html输出到页面的任何地方。您需要实际输出创建的信息。例如：

HTML：

<div ="outputContainer"></div>

在你的功能中：

$("#outputContainer").html(form);

Answer 2

正确撤消报价

请更改行：

form += '<td> <button onclick="ShowHide("#filename'+ i +')">  Show/hide document </button> </td> </tr>';

到此：

form += '<td> <button onclick="ShowHide(\'#filename'+ i +'\')">  Show/hide document </button> </td> </tr>';
                                        ^                 ^

动态创建表单中的showhide函数不起作用

2 个答案: