jquery - jQuery 无法捕获提交事件

Question

我有一个带有名为 Apply 的提交按钮的表单，

视觉的

HTML

<div id="accordion">
    <div>
       <h3><a href="#">Theme color and layout</a></h3>
       <div>
       <!-- Colour picker code -->
        <form id="applyColor">
           <input class='simple_color' value='#cc3333'/>     
           <input type='submit' value='Apply'/>
        </form>
        </div>
    </div>
<div>

Javascript

//Colour picker
$(document).ready(function(){
    $('.simple_color').simpleColor();

    $("#applyColor").submit(function() {
        alert($('input.simple_color')[0].value);
    });
});

问题 ：

现在，每当我单击提交按钮时，它都不会执行我的警报语句。我曾尝试使用简单的警报语句，alert('Hello World!');但效果不佳。

我不确定出了什么问题，我做错了什么吗？

---

链接的jQuery

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>

我用来创建颜色选择器和关于通过 ajax 发布的教程的资源，

• 选色器
• 如何通过 jquery ajax 发布表单

Answer 1

当我没有正确引用颜色选择器时，我只能重现您的问题。当我确实引用它时，该解决方案按预期工作：

$(".simple_color").simpleColor();

$("#applyColor").on("submit", function(event){
    event.preventDefault();
    alert( 'Submitted' );
});

工作： http: //jsbin.com/ejovir/2/edit
不工作（插件未引用）：http: //jsbin.com/ejovir/3/edit

检查您的控制台以获取类似于以下内容的消息：

未捕获的类型错误：对象 [object Object] 没有方法“simpleColor”