Javascript 输入按钮单击事件未在HTML中触发_Javascript_Html

Javascript 输入按钮单击事件未在HTML中触发

javascript html

Javascript 输入按钮单击事件未在HTML中触发,javascript,html,Javascript,Html,我不知道为什么我的代码没有执行。我只是在单击按钮时将文本框值分配给段落的innerHTML <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Error handling</title> <script> $(document).ready(function () { $(

我不知道为什么我的代码没有执行。我只是在单击按钮时将文本框值分配给段落的innerHTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Error handling</title>
    <script>
        $(document).ready(function () {
            $("btnName").click(function () {
                var x = document.getElementById("Demo");
                x.innerHTML = document.getElementById("txtName").value;
                alert("Done");
            });
        });
    </script>
</head>
<body>
    <input id="txtName" type="text" />
    <br />
    <input id="btnName" type="button" value="Try It" />
    <p id="Demo"></p>
</body>
</html>


错误处理
$（文档）.ready（函数（）{
$（“btnName”）。单击（函数（）{
var x=document.getElementById（“演示”）；
x、 innerHTML=document.getElementById（“txtName”）.value；
警惕（“完成”）；
});
});

应该是

$("#btnName");

而不是

$("btnName");

顺便说一下，您可以一直使用Jquery：

$('#Demo').html($('#txtName').val());

jQuery使用类似CSS的选择器来查找和操作元素

您的代码应如下所示：

$(document).ready(function() {
  $('#btnName').click(...)
})

这一行：

$("btnName").click(function () {

应该是：

$("#btnName").click(function () {

看

您还需要导入jQuery库（在

标记中）：

试试这个

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Error handling</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
    <script>
        $(document).ready(function () {
            $("#btnName").click(function () {
                var x = document.getElementById("Demo");
                x.innerHTML = document.getElementById("txtName").value;
                alert("Done");
            });
        });
    </script>
</head>
<body>
    <input id="txtName" type="text" />
    <br />
    <input id="btnName" type="button" value="Try It" />
    <p id="Demo"></p>
</body>
</html>


错误处理
$（文档）.ready（函数（）{
$（“#btnName”）。单击（函数（）{
var x=document.getElementById（“演示”）；
x、 innerHTML=document.getElementById（“txtName”）.value；
警惕（“完成”）；
});
});

希望这有助于：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Error handling</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function () {
        $("#btnName").click(function () {
            var x = document.getElementById("Demo");
            x.innerHTML = document.getElementById("txtName").value;
            alert("Done");
        });
    });
    </script>
</head>
<body>
<input id="txtName" type="text" />
<br />
<input id="btnName" type="button" value="Try It" />
<p id="Demo"></p>
</body>
</html>


错误处理
$（文档）.ready（函数（）{
$（“#btnName”）。单击（函数（）{
var x=document.getElementById（“演示”）；
x、 innerHTML=document.getElementById（“txtName”）.value；
警惕（“完成”）；
});
});

$（“btnName”）

应该是

$（#btnName”）

你的jquery脚本标签在哪里？@AwakeZoldiek抱歉。但还是一样的问题。没发生什么。抱歉。没发生什么：）：）抱歉。没发生什么。DMKE的答案应该可以解决你的问题，但你有另一个问题：你没有引用jquery。@DMKE是的。我现在知道了。谢谢。抱歉。没发生什么。正如其他人说的，你应该包括Jqu您可以在标题中使用JQuery：

x.innerHTML=document.getElementById（“txtName”）.value；

应该是：

$（'#Demo'）.html（$（'#txtName'）.val（））；

抱歉，什么也没有发生。谢谢。它可以工作，还可以节省手动下载和添加JQuery参考脚本的时间。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Error handling</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function () {
        $("#btnName").click(function () {
            var x = document.getElementById("Demo");
            x.innerHTML = document.getElementById("txtName").value;
            alert("Done");
        });
    });
    </script>
</head>
<body>
<input id="txtName" type="text" />
<br />
<input id="btnName" type="button" value="Try It" />
<p id="Demo"></p>
</body>
</html>