Question

我是一个完整的新手，我无法弄清楚我的代码有什么问题。我想要＃34; Hello world＆＃34;转变为“我爱狗狗”＃34;如果用户将Dogs输入到输入框中，或者更改＆＃34; Hello World＆＃34;为什么不是狗？！＆＃34;如果他们不把狗放入输入框。

当用户输入文本然后单击提交时，我运行if语句以查看它是否为Dogs。然后我想用不同的h1替换h1。

<!DOCTYPE html>
<html>
<head>
        <link rel='stylesheet' href='style.css'/>
    <script src='script.js'></script>
</head>
<body>
<h1>Hello World</h1>
<input id="inputBox"><id/>
<button onclick="changeInputBoxText()">Submit</button>
<script>
    function changeInputBoxText()
    {
        if (document.getElementById("inputBox")==="Dogs")
        {
            $("h1").replaceWith("<h1>I love Dogs</h1>");
        }
        else
        {
            $("h1").replaceWith("<h1>Why not dogs?!</h1>");
        };
    };
</script>

</body>
</html>

Answer 1

为什么你在混淆jquery和javascript时都在苦苦挣扎。只需使用jquery从文本框中获取值，使用id selector和.val()即可完成此操作。

尝试，

function changeInputBoxText() {
  if($("#inputBox").val() === "Dogs") {
    $("h1").text("I love Dogs");
  } else {
    $("h1").text("Why not dogs?!");
  };
};

或使用纯Jquery，

$(":button").click(function(){
  $("h1").text(($("#inputBox").val() === "Dogs")?"I love Dogs":"Why not dogs?!");
});

DEMO

Answer 2

尝试：

document.getElementById("inputBox").value

Answer 3

如果你想通过jQuery完成它：

<script>
    $(function(){
    $('button').click(function()
    {
        if ($('#inputBox").val()==="Dogs")
        {
            $("h1").html("I love Dogs");
        }
        else
        {
            $("h1").html("Why not dogs?!");
        };
    };
    });
</script>

Answer 4

 if (document.getElementById("inputBox").value==="Dogs")

检查您错过的这句话.value

Answer 5

使用您的代码应该是这样的：

function changeInputBoxText()
    {
        if ($("#inputBox").val().trim().indexOf("Dogs")>-1)
        {
            $("h1").html("I love Dogs");
        }
        else
        {
            $("h1").html("Why not dogs?!");
        };
    };

请注意，这会检查用户是否在输入中的某处输入了Dogs，因此他可以输入“我想要狗”并且仍然会计算...

Answer 6

测试你的情况id.value ==＆＃39; test＆＃39;

if (document.getElementById("inputBox").value==="Dogs")

check this DEMO

想要在单击提交按钮后将h1更改为输入框内的文本用户输入

6 个答案:

DEMO