0

我有一个页面，其中包含从数据库生成的许多不同表单。每个表单在底部都有一个 div 用于加载数据。这些具有动态 ID：tempdiv_1 tempdiv_2 等。

我正在尝试让 jquery 工作以根据 this.input.val 之类的内容更新 div，这是带有部分 ID 的隐藏输入。

代码：

<script type="text/javascript">
$('#formdataAddForm').live('submit' , function() { // catch the form's submit event
   $.ajax({ // create an AJAX call...
        data: $(this).serialize(), // get the form data
        type: $(this).attr('method'), // GET or POST
        url: $(this).attr('action'), // the file to call
        success: function(response,data) { // on success..
            $.fancybox({
            maxWidth    : 800,
            maxHeight   : 200,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none',
            content     : response
        });
        $('#tempdiv_'+(('input[id="formdataSection"]', form).val())).load('/page/list.php');
    }
});
return false; // cancel original event to prevent form submitting
});
</script>

我无法开始工作的地方是这样的：

 $('#tempdiv_'+(('input[id="formdataSection"]', form).val())).load('/page/list.php');

如何让 jquery 更新动态 div？这些表格都有相同的 ID，所以我不能调用表格 ID。

4

1 回答 1

0

试试这个代码：

 <script type="text/javascript">
   $('#formdataAddForm').live('submit' , function() { // catch the form's submit event
   var form = $(this)
   $.ajax({ // create an AJAX call...
        data: $(this).serialize(), // get the form data
        type: $(this).attr('method'), // GET or POST
        url: $(this).attr('action'), // the file to call
        success: function(response,data) { // on success..
            $.fancybox({
            maxWidth    : 800,
            maxHeight   : 200,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none',
            content     : response
        });
        $('#tempdiv_'+($('input[id="formdataSection"]', form).val())).load('/page/list.php');
    }
});
return false; // cancel original event to prevent form submitting
});
</script>

如果您问题中的代码与您尝试运行的代码相同 - 这应该会有所帮助。在您的代码表单变量中未定义，您在此行中错过了 $：$('#tempdiv_'+($('input[id="formdataSection"]', form).val())).load('/page/list.php');

此外，如果您将使用name属性而不是id用于存储 div id 的输入，那会更好。ID 必须是唯一的，并且名称 - 否。假设表单上下文（中的第二个参数$('input[id="formdataSection"]', form)）应该有助于找到正确的值（我记得，我一直在成功地尝试类似的方法），但名称更可靠和有效。

于 2012-09-10T11:56:30.547 回答