Question

我不知道我是否正确地接近这一点。我有一个主页面，我正在显示一些信息。然后，您可以单击一个按钮，然后页面将通过从单独的文件加载表单来显示表单：

    $('#viewport').load('/views/myView.php #targetDiv')

这很好用。但这种观点是一种形式。我想再用Ajax提交包含的表单。但我似乎无法做到这一点。我认为这是因为如果我为表单设置了一个按钮处理程序，它就不起作用，因为在加载主页面和JQuery脚本时表单不存在。

所以要清楚，我正在使用JQuery和Ajax加载将这个div加载到我的主页面上。然后我想简单地用Ajax提交这个表单。

<div id="targetDiv">
<div class="title">Submit News</div>
    <form role="form" id="submitMyForm">

        <div class="form-group">
            <label for="myInput">Input here</label>
            <input type="text" class="form-control" id="myInput">
        </div>

        <button type="button" id="subMyFormBtn" class="btn btn-default">Submit</button>    
    </form>        
</div>

TIA

完整解决方案：

$('#viewport').load('/views/myView.php #targetDiv');
$("#targetDiv").live("submit",function(e){
    e.preventDefault();
    //ajax here
});

Answer 1

你必须这样做：

$("#subMyFormBtn").live("submit",function(

$("#submitMyForm").submit();

));

Answer 2

你可以做点什么

 $('#viewport')
     .load('/views/myView.php #targetDiv')
     .done(function () {
         $('#yourform').submit(function (e) {
             $.ajax(..)
             e.preventDefault()
         });
     });

或

$('body').on('submit', '#yourform', function (e) {
    $.ajax(..)
    e.preventDefault()
});

用ajax表单加载div区域提交？

2 个答案: