Question

我在JavaScript上编写了这个（完整代码）代码。

在第6行，我编写了代码：

div_new = div_new+"<form name='"+name+"' onsubmit="+ return refresh(name, url, document.forms[name][name].value , '', '', 'refresh'); +" method='post' style='display:inline;'>";

当我添加此代码时，页面效果不佳。

我认为onsubmit的引号存在问题，因为当我删除'onsubmit'时一切正常。

如果我用常规HTML（而不是JS）编写完整的代码，一切都很好。

我该怎么做才能解决问题？

完整代码：

function chat(mem_id) {
    count++;
    var div_new = "<div style='position:absolute; width:200px; bottom:0px; left:10px;'>";
        div_new = div_new+"<div style='width:100%; background-color:green;'>top "+ mem_id +" - "+count+"</div>";
        div_new = div_new+"<div style='width:100%; height:300px; background-color:pink;'>bottom // refresh_chat"+ mem_id +" ";
    var name = "send_chat_"+mem_id;
    var url = "send_chat.php";
        div_new = div_new+"<form name='"+name+"' onsubmit="+ return refresh(name, url, document.forms[name][name].value , '', '', 'refresh'); +" method='post' style='display:inline;'>";
        div_new = div_new+"<textarea name='"+name+"' autofocus=autofocus placeholder='"+name+"'></textarea><input type=submit value=' send '>";
        div_new = div_new+"</form>";
        div_new = div_new+"</div>";
        div_new = div_new+"</div>";
    bottom = div_new;
    document.getElementById('bottom').innerHTML = bottom;
}

Answer 1

请参阅demo here

这一行有几个错误

div_new = div_new+"<form name='"+name+"' onsubmit="+ return refresh(name, url, document.forms[name][name].value , '', '', 'refresh'); +" method='post' style='display:inline;'>";

使用此代码

function chat(mem_id) {
    count++;
    var div_new = "<div style='position:absolute; width:200px; bottom:0px; left:10px;'>";
        div_new = div_new+"<div style='width:100%; background-color:green;'>top "+ mem_id +" - "+count+"</div>";
        div_new = div_new+"<div style='width:100%; height:300px; background-color:pink;'>bottom // refresh_chat"+ mem_id +" ";
    var name = "send_chat_"+mem_id;
    var url = "send_chat.php";
        div_new = div_new+"<form name='"+name+"' onsubmit=\"return refresh(" + name +","+ url+",document.forms[name][name].value , '', '', 'refresh');\" + method='post' style='display:inline;'>";
        div_new = div_new+"<textarea name='"+name+"' autofocus=autofocus placeholder='"+name+"'></textarea><input type=submit value=' send '>";
        div_new = div_new+"</form>";
        div_new = div_new+"</div>";
        div_new = div_new+"</div>";
    bottom = div_new;
    document.getElementById('bottom').innerHTML = bottom;
}

主要问题是因为双引号返回不是字符串的一部分，他需要使用转义序列

这是正确的解决方案

div_new = div_new+"<form name='"+name+"' onsubmit=\"return refresh(" + name +","+ url+",document.forms[name][name].value , '', '', 'refresh');\" + method='post' style='display:inline;'>";

我还在这里添加了相同的转义序列

Answer 2

你是对的，问题是报价。当您撰写onsubmit="时，最终"正在关闭您在div_new+处开始的字符串。解决方案是escape the quote character。 JavaScript允许您使用\字符执行此操作：\"。所以这就应该是这条线：

div_new = div_new+"<form name='"+name+"' onsubmit=\"+ return refresh(name, url, document.forms[name][name].value , '', '', 'refresh'); +\" method='post' style='display:inline;'>";

页面在带有表单的JavaScript代码中不起作用

2 个答案: