Question

我有一个带有输入区域和提交按钮的HTML页面。

我正在使用jQuery提醒用户他们的输入是什么。（实际上我正在尝试将其存储在变量中，但是一旦我开始工作，这将是微不足道的）。

有人可以帮助我理解它为什么不起作用，以及解决方案吗？谢谢。

HTML表单如下：

<html>
    <head>
    </head>
    <body>
        <form>
            <input type="text" class="grid_size">
            <button type="submit">Submit Me!</button>
        </form>
        <!-- Add jQuery -->
        <script src="js/jquery.js"></script>
        <script src="js/custom.js"></script>
    </body>
</html>

我使用的自定义jQuery是这样的：

$(document).ready(function() {
    $("form").submit(function() {
    alert( grabUserInput )});
});

function grabUserInput() {
    return $("form").find(".grid-size").val();
}

Answer 1

您将类命名为grid_size，并在javascript代码中搜索类网格大小。这段代码应该修正一个拼写错误：

$(document).ready(function() {
    $("form").submit(function() {
        alert( grabUserInput() );
    });
});

function grabUserInput() {
    return $("form").find(".grid_size").val();
}

Answer 2

试试这个 - grabUserInput是一个函数，而不是变量 - 所以你必须包含()来调用函数：

$(document).ready(function() {
    $("form").submit(function() {
        alert( grabUserInput() );
    });
});

您的标记必须与您的选择器匹配：

 <input type="text" class="grid-size">

<强>奖金：

如果你想要的只是提醒价值，而你不想提交表格，请使用以下内容：

$(document).ready(function() {
    $("form").submit(function(e) {
        e.preventDefault()
        alert( grabUserInput() );
    });
});

Answer 3

为什么不尝试添加一些id

<input id="input_grid_size" type="text" class="grid_size">
<button id="button_submit" type="submit">Submit Me!</button>

和jq

$(document).ready(function() {
    $("#button_submit").click(function() {
    alert($('#input_grid_size').val()); }); });

似乎你的代码也忘记了＆＃34;;＆＃34;和＆＃34;（）＆＃34;在警报

单击按钮时的jQuery用户输入

3 个答案: