Question

在我的JavaScript代码中，我有以下几行：

document.write("</form><button style='margin-top:100px; width:150px; position:absolute; left:50%; margin-left:-75px' type='button' onclick='Proceed('test')'>Se resultat</button>");

样式和类型属性工作正常但是当我尝试将参数传递给JavaScript函数时继续它不起作用。我也试过(\'test\')

我该如何解决这个问题？

编辑：完整的HTML脚本

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Title here.</title>
    <script>
        function Proceed(var test)
        {
            alert(test);
        }
    </script>
</head>
<body style="font-family:Palatino">
    <img src="logo.png"/>
    <hr/>
    <h1 style="text-align:center">Description here.</h1>        

    <script>

        if (window.XMLHttpRequest)
        {
            request=new XMLHttpRequest();
        }
        else
        {
            request=new ActiveXObject("Microsoft.XMLHTTP");
        }
        request.open("GET","data.xml",false);
        var XMLdocument;
        request.onreadystatechange=function()
        {
            if (request.readyState==4)
            {
                XMLdocument = request.responseXML;
            }
        };
        request.send();
        var questions = XMLdocument.getElementsByTagName("question");
        for(i = 0; i < questions.length; i++)
        {
            var x = questions[i];
            var questionvalue = x.getElementsByTagName("questionvalue");
            document.write("<p style='margin-top:50px; font-size:20px; font-weight:bold; text-align:center'>" + questionvalue[0].childNodes[0].nodeValue + "</p>");
            var answers = XMLdocument.getElementsByTagName("answer");
            document.write("<form>");
            for(n = 0; n < answers.length; n++)
            {
                y = answers[n];
                var answervalue = y.getElementsByTagName("answervalue");
                document.write("<input style='margin-left:43%; margin-right:20px;' type='radio' name='" + questionvalue[0].childNodes[0].nodeValue + "' value='" + answervalue[0].childNodes[0].nodeValue + "'>" + answervalue[0].childNodes[0].nodeValue + "<br/>");
            }
            document.write("</form><button style='margin-top:100px; width:150px; position:absolute; left:50%; margin-left:-75px' type='button' onclick='Proceed(\"test\")'>Se resultat</button>");
        }
    </script>
</body>
    </html>

Answer 1

它不起作用，因为它是无效的HTML：

document.write("</form><button ... onclick='Proceed('test')'>...</button>");

将写成：

</form><button ... onclick='Proceed('test')'>...</button>

当它写入DOM时，onclick的引用样式决定了它的结束位置，基本上是onclick Proceed(的值。您需要更改引用字符：

document.write("</form><button ... onclick=\"Proceed('test')\">...</button>");

或：

document.write("</form><button ... onclick='Proceed(\"test\")'>...</button>");

修改：有关简单示例，请参阅this plunkr

Answer 2

将它们更改为转义双引号应该适合您。

document.write("</form><button style='margin-top:100px; width:150px; position:absolute; left:50%; margin-left:-75px' type='button' onclick='Proceed(\"test\")'>Se resultat</button>");

Answer 3

您可以将单引号更改为转义双引号：

onclick='Proceed(\"test\")'

如何在JavaScript中正确使用引号？

3 个答案: