使用jQuery单击按钮时无法显示输入中的文本答案

【问题标题】：Can't show text from an input when click button with jQuery使用jQuery单击按钮时无法显示输入中的文本
【发布时间】：2019-01-26 21:43:00
【问题描述】：

我正在尝试编写一个简单的表单，当我单击提交按钮时，它将获取一些文本然后显示在对话框中。

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <title>Página Teste</title>
</head>
<body>
<header>
    <div>
        <h1>Questão 4</h1>
    </div>
</header>

<div>
    <label for="texto">Texto: </label>
    <textarea name="texto" id="texto" rows="5" cols="10"></textarea>

    <button type="submit" id="submit">Enviar</button>
</div>  
<script>

    var teste = $("texto").val;

    $("submit").on("click", function(){
        $("teste").dialog("open");
    });

</script>
</body>
</html>

当我点击按钮时，什么也没有发生，我已经尝试了一些执行此脚本的方法，但似乎都没有。

【问题讨论】：

缺少# 应该是....$("#teste").dialog("open"); 和$("#texto").val()
谢谢，这确实是我的错误，但它仍然无法在这里工作。我打开 .html 页面，输入内容，单击按钮，但没有任何反应。
缺少# ....$("#submit").on("click", function(){
1) 从我上面看到的情况来看，没有 ID 为 teste 的元素可以充当对话框。 2) .dialog() 是一个 jQuery-UI 方法，库没有加载。 3) 打开console...你肯定有一些有意义的错误。

标签： javascript jquery html

【解决方案1】：

您缺少一些 # 和 .val 是一个函数，所以请使用 .val()。

我不确定我是否理解您想要对对话框执行的操作，但应该尝试以下操作：

$("#submit").on("click", function(){
    var teste = $('#texto').val();

    alert(teste);
});

【讨论】：

【解决方案2】：

试试这个：

$(document).ready(function(){
  var teste = $("texto").val;
    $("#submit").on("click", function(){
        console.log("something happens");
    });})

【讨论】：

【解决方案3】：

您可以使用准备好的文档。此外，如果您愿意，您可以拥有单独的 javascript 文件并执行更多操作

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <title>Página Teste</title>
</head>
<body>
<header>
    <div>
        <h1>Questão 4</h1>
    </div>
</header>

<div>
    <label for="texto">Texto: </label>
    <textarea name="texto" id="texto" rows="5" cols="10"></textarea>

    <button type="submit" id="submit">Enviar</button>
</div>  
<script>

 $(document).ready(function(){
   var teste = $('#texto').val();
    $("#submit").on("click", function(){
        alert("teste")
    });})

</script>
</body>
</html>

【讨论】：

准备好文档的包装器是一个不错的建议...但这里绝不是问题，因为脚本位于 HTML 标记之下。 -- 一个单独的.js文件根本不允许更多的操作，它只允许一个脚本在多个页面中使用。

【解决方案4】：

当你调用 $("teste").dialog("open"); 或 $("texto").val() 时，jQuery 会在 dom 中寻找元素 <teste></teste>。由于您的示例中不存在该元素，因此它不会做任何事情。

也许您在传递给$(selector) 的选择器中缺少. 或#？

【讨论】：