3

我首先想说的是我对 javascript 和 jQuery 非常陌生。我想这是一个非常愚蠢和简单的问题,我知道这方面有很多问题,我确实尝试了所有这些问题。虽然我似乎无法解决我的问题。

我有一个输入字段和一个提交按钮。单击提交时,我想将输入的内容保存到数据库中,并继续与页面上的内容保持在同一页面中。

我的Javascript代码如下:

 <script type="text/javascript">
        $(document).ready(function()
        {
            $('#submit').submit(function(e)
            {

                e.preventDefault();
                var msg = $('#uname').val();
                $.post("c_test/test_submit", {uname: msg}, function(r) {
                   console.log(r);
                });
            });
        });
    </script>

我的html代码如下(我使用codeigniter):

$this->load->helper('form');
echo form_open();
$data =array ('name'=>'uname','id'=>'uname');
echo form_input($data) . '<br />';
$data=array('name'=>'submit','id'=>'submit','value'=>'Submit');
echo form_submit($data);
echo form_close();

如果有人能指出我的愚蠢,我将不胜感激。谢谢!

4

4 回答 4

4

您正在使用

$('#submit').submit(function(e){ ... });

在这种情况下submitbutton/input'sid并且它没有这样的事件submit,而不是你可以使用click事件,比如

$('#submit').click(function(e){ ... });

或者

$('#submit').on('click', function(e){ ... });

否则,您可以更改以下行

echo form_open();

echo form_open('c_test/test_submit', array('id' => 'myform'));

而不是

$('#submit').click(function(e){ ... });

您可以使用

$('#myform').submit(function(e){
    e.preventDefault();
    var msg = $('#uname').val();
    var url=$(this).attr('action');
    $.post(url, {uname: msg}, function(r) {
        console.log(r);
    });
});

或者

$('#myform').on('submit', function(e){
    e.preventDefault();
    var msg = $('#uname').val();
    var url=$(this).attr('action');
    $.post(url, {uname: msg}, function(r) {
        console.log(r);
    });
});
于 2012-10-09T21:51:29.363 回答
1

似乎带有id“提交”的元素是表单的提交按钮 - <input type="submit">。但是,该submit事件由form触发,而不是由提交按钮触发,因此您的绑定事件处理程序不会触发。

将“提交”移动到表单上,或者在绑定事件处理程序id时更改选择器:submit

$('form').submit(function(e) {
    // handle submit event from the form
});
于 2012-10-09T21:25:51.797 回答
1

你必须这样做:

<?php
$this->load->helper('form');

echo form_open('', array( 'id' => 'myform'));
..

和:

 $('#myform').submit(function(e)
     {
            e.preventDefault();
            var msg = $('#uname').val();
            $.post("c_test/test_submit", {uname: msg}, function(r) {
               console.log(r);
            });

            return false;
     });

提交事件总是转到表单而不是表单按钮。

于 2012-10-09T21:26:33.797 回答
0

也许是这样的:

$data=array('name'=>'submit','id'=>'submit','value'=>'Submit','onsubmit'=>'return false;');

这将阻止表单发布,进而阻止页面刷新。但是,它将要求您通过 ajax 提交表单。

于 2012-10-09T21:23:14.460 回答