Question

我是javascript的新手，我正在按照下面的代码进行教程，在显示警报之前，按钮内容应该更改为adding，但我的代码无效

＆＃13;

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<form class="form-item">
    <div class="cart">
        <input type="submit" value="Add to Cart" />
    </div>
</form>


<script>
    $(document).ready(function(){
        $("button").click(function(){
            button_content.html('Adding...'); //Loading button text
            alert("Item added to Cart!"); //alert user
        });
    });
</script>

＆＃13;

我该如何解决这个问题？

Answer 1

$("button")不是正确的选择器。这将寻找<button>元素，而你没有。{/ p>

您需要$("input[type=submit]")，或者更好的是，给它一个ID并使用选择器：$("#mybutton")。

请记住，这仍然会将表单提交回服务器 - 它只会等到警报执行此操作。

Answer 2

您没有标签可以使用jquery选择它。你的html必须看起来像这样才能工作：

<form class="form-item">
    <button class="cart">Add to Cart</button>
</form>

Answer 3

尝试使用此代码有几个原因。

and

尽可能在任何地方使用ID。随意缩短您的准备声明。使用jQuery的on handler而不是点击。

Answer 4

您的问题出在jquery选择器和函数参考

中

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<form class="form-item">
    <div class="cart">
        <input type="submit" value="Add to Cart" />
    </div>
</form>


<script>
    $(document).ready(function(){
        $("input[type=submit]).click(function(){
            $(this).html('Adding...'); //Loading button text
            alert("Item added to Cart!"); //alert user
        });
    });
</script>

Answer 5

<button name="submit" value="Add to Cart" id="sendFeed">Add to card</button>

<script>
$(document).ready(function(){
    $("button").click(function(){
        button_content.html('Adding...'); //Loading button text
        alert("Item added to Cart!"); //alert user
        return false;
    });
});

Answer 6

您的代码中没有button元素。如果您要定位input元素，则需要使用selector标记进行输入，然后使用.val()选项显示文本。

$(document).ready(function(){
        $("input").click(function(){
            $(this).val('Adding...'); //Loading button text
            alert("Item added to Cart!"); //alert user
        });
    });

示例：https://jsfiddle.net/fz66qdv4/

Answer 7

试一试：

＆＃13;

<html>
<head>
</head>
<body>
   <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<form class="form-item">
    <div class="cart">
        <input type="submit" value="Add to Cart" />
    </div>
</form>


<script>
    $(document).ready(function(){
        $("input[type=submit]").click(function(){
            $(this).val('Adding...'); //Loading button text
            alert("Item added to Cart!"); //alert user
        });
    });
</script>
</body>     
</html>

＆＃13;

在javascript中显示提醒

7 个答案: