0

I have a form with a number of text inputs and a submit button at the end. On submit I'd like to trigger a function and I'm having difficulty.

The form is below and I have tried the following:

$('#contactForm input.btn_submit').click(function(event){ // function here

$('#contactForm input.btn_submit').click(function(event){ // function here

$('#contactForm.report_row.input.btn_submit').click(function(event){ // function here

But with no luck.

Here is the form:

<form action="https://example.com/index.php/contact" method="post" id="contactForm" name="contactForm">
    <input type="hidden" />

    <div class="report_row">
        <strong>Your Name:</strong><br />
        <input type="text" id="contact_name" name="contact_name" value=""  class="text" />              </div>
    <div class="report_row">
        <strong>Your Email Address:</strong><br />
        <input type="text" id="contact_email" name="contact_email" value=""  class="text" />                </div>
    <div class="report_row">
        <strong>Your Phone Number:</strong><br />
        <input type="text" id="contact_phone" name="contact_phone" value=""  class="text" />                </div>
    <div class="report_row">
        <strong>Message Subject:</strong><br />
        <input type="text" id="contact_subject" name="contact_subject" value=""  class="text" />                </div>                              
    <div class="report_row">
        <strong>Message:</strong><br />
        <textarea id="contact_message" name="contact_message"  rows="4" cols="40" class="textarea long" ></textarea>                </div>      
    <div class="report_row">
        <strong>Security Code:</strong><br />
        20 + 9 = <br />
        <input type="text" id="captcha" name="captcha" value=""  class="text" />                </div>
    <div class="report_row">
        <input name="submit" type="submit" value="Send Message" class="btn_submit" />
    </div>
</form>

How would I trigger a function on someone clicking the submit button at the end?

4

4 回答 4

2

不清楚“我遇到困难”是什么意思。

可能是您没有停止表单提交,因此您可以运行您的函数。在这种情况下,您需要使用.preventDefault(). 我建议你也将你的函数包装在一个准备好的函数中,这样你的代码就会在页面加载所有 html 时运行。

喜欢:

$('#contactForm input.btn_submit').click(function(event){ 
    event.preventDefault();
    // rest of code
    alert('Working!');
});

演示在这里

于 2013-09-10T20:24:20.563 回答
1

关于什么

$('form').submit(function(){// ...
                                    });
于 2013-09-10T20:18:23.710 回答
1

提交表单时将触发以下内容:

$(document).ready(function() {
    $('#contactForm').submit(function() { 
        //... your code here
    });
});
于 2013-09-10T20:18:24.517 回答
1

也许你可以尝试做这样的事情:

$('#contactForm').submit(function() {

}); 

或者

$('#contactForm').on('submit', function() {

});
于 2013-09-10T20:20:02.610 回答