Question

以下是以下简单代码。当我点击按钮时，调用javascript函数myFunction，并将变量str设置为字符串test。最后，存储在变量str中的值被设置为id属性等于demo的文本字段，并在文本字段中显示该字符串。

然而，实际上，当我点击Click Me按钮时没有任何反应。您可以在浏览器中试用它。有人可以告诉我如何修改代码，以便在单击“单击我”按钮时文本字段中显示文本“test”。

由于

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction(str)
{
$('#demo').val(str);
}
</script>
</head>
<body>

<p>Testing...</p>

<button onclick="myFunction("test")">Click me</button>

<input type="text" id="demo" />


</body>
</html>

Answer 1

改为：

onclick='myFunction("test")'

也这样做：

function myFunction(str) {
    document.getElementById('demo').value = str;
}

.querySelectorAll()

document.querySelectorAll('#demo').value = str;

你有一个糟糕的双引号实现，比如用单引号包装它或者逃避内部引用。

注意：

您还没有使用过jQuery库，所以这仍然无法按预期工作，因此您可以选择加载jQuery库，也可以使用本机javascript。

最好不要引人注目：

首先这样做：

<button id="btn">Click me</button>

然后这个脚本：

function myFunction(str) {
    document.getElementById('demo').value = str;
}

document.getElementById('btn').onclick = function(){
    myFunction('test');
};

Answer 2

报价错误！

更改

<button onclick="myFunction("test")">Click me</button>

到

<button onclick="myFunction('test')">Click me</button>

Answer 3

正如其他人指出您需要使用单引号，但是您还引用了$作为函数，但似乎没有包含任何其他库。

假设你正在使用jQuery，这应该可行：

<!DOCTYPE html>
<html>
<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
function myFunction(str)
{
$('#demo').val(str);
}
</script>
</head>
<body>

<p>Testing...</p>

<button onclick="myFunction('test')">Click me</button>

<input type="text" id="demo" />


</body>
</html>

Answer 4

解决

""

需要更改''

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script>
        function myFunction(str) {
            $('#demo').val(str);
        }
    </script>
</head>
<body>

<p>Testing...</p>

<button onclick="myFunction('test')">Click me</button>

<input type="text" id="demo"/>


</body>
</html>

Answer 5

你代码中的两件事。 $('#demo').val(str);是一个jquery＆amp;你没有添加jquery库。＆安培; <button onclick="myFunction("test")">Click me</button>是错误

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction(str)
{
document.getElementById("friendName").value=str;
}
</script>
</head>
<body>

<p>Testing...</p>

<button onclick="myFunction('test');">Click me</button>

<input type="text" id="demo" />


</body>
</html>

Javascript onclick事件无法正常运行

5 个答案:

注意：

解决