使用jQuery單擊按鈕時無法顯示輸入文本

Question

我正在嘗試編寫一個簡單的表單，該表單將獲取一些文本，然后在我單擊“提交”按鈕時顯示在對話框中。

<!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>

當我單擊該按鈕時，什么都沒有發生，並且我嘗試了一些執行此腳本的方法，但似乎沒有任何效果。

Answer 1

您缺少一些#而.val是一個函數，因此請使用.val() 。

我不確定我是否理解您要使用的對話框，但是應該嘗試如下操作：

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

    alert(teste);
});

Answer 2

嘗試這個：

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

Answer 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>

Answer 4

當您調用$("teste").dialog("open"); 或$("texto").val() jQuery將在dom中查找元素<teste></teste> 。 由於該元素在您的示例中不存在，因此不會執行任何操作。

也許您錯過了. 或#傳遞給$(selector) ？

使用jQuery單擊按鈕時無法顯示輸入文本

問題描述

4 個解決方案

解決方案1
2 已采納 2019-01-26 13:35:24

解決方案2
1 2019-01-26 13:28:54

解決方案3
0 2019-01-26 13:37:39

解決方案4
0 2019-01-26 13:43:00

使用jQuery單擊按鈕時無法顯示輸入文本

問題描述

4 個解決方案

解決方案1 2 已采納 2019-01-26 13:35:24

解決方案2 1 2019-01-26 13:28:54

解決方案3 0 2019-01-26 13:37:39

解決方案4 0 2019-01-26 13:43:00

解決方案1
2 已采納 2019-01-26 13:35:24

解決方案2
1 2019-01-26 13:28:54

解決方案3
0 2019-01-26 13:37:39

解決方案4
0 2019-01-26 13:43:00