php - 访问使用 jQuery 的 load() 函数加载的 html 内容

Question

我对 jQuery ajax 的工作方式有点困惑。我正在尝试使用 jQuery 和 php 创建一个客户管理系统 (CMS)。

我想给用户创造汽车的机会。假设他必须定义一个“汽车名称”并选中复选框列表中的一些选项。 在同一页面上，我让用户有机会添加或删除一些选项。这个加 删除发生在 jQuery 和 ajax 中。当用户添加一个选项时，我调用一个 php 页面 (addOption.php) 来处理该选项并将其添加到数据库中。如果 ajax 调用成功，我将使用 ajax load() 函数重新加载 div 中的选项。谁调用了一个 php 页面 (reloadOptions.php)，该页面从数据库中读取选项并将它们构建到一个复选框列表中。

一切正常。当我尝试检查选中了哪些复选框时出现问题。 (这里是难句) 页面源中似乎没有数据。我认为发生这种情况是因为 ajax 的异步工作。我真的需要选项来创建汽车!

最后，我的问题是如何访问该选项数据？如果你不能，还有吗 您可以访问该数据的方式？ 您如何看待我处理 cms 系统的方法？好/坏/我的天啊/...

下面是我使用的一些代码块:

页面 index.php :处理选项和 html 代码的 jQuery/ajax

 //At the start i load the options in
$('.options').load('./php/OptionsReload.php');

$("#FormOptions").submit(function(e) {
    $.ajax({
        type: "POST",
        url: "./php/addOption.php",
        data: $(e.target).serialize(),
        dataType: "json",
        success: function(data) {
            $('.options').load('./php/reloadOptions.php');
        }
    });
    return false; 
});

..................
//Form where you can add the option
     <form id="FormOptions">
             <input type="text" name="optionName" />
             <input type="submit" name="submitOption" value="Add option" />
</form>

......................
 //Div where i show the options to the user
      <form name="formChecks" method="post" enctype="multipart/form-data">
             <div class="options">
                   //Content loaded with jQuery
             </div>
       </form>

addOption.php 页面:将选项添加到数据库的代码

 //Database connect
...
return mysql_query("INSERT INTO options(option) VALUES('". $POST_['optionName'] ."');");

页面 reloadOptions.php :使用选项构造 html 的代码

<select name="mydropdown">
    <?php 
            $options = ...... connect with DB and select all the options
              while($row = mysql_fetch_assoc($options))
               {
                      echo ("<option value='" . $row['Id'] . "'>" . $row['optionName'] . "</option>");
               }
     ?>
</select>

提前致谢， 伯特

Answer 1

也许我不明白您要做什么，但您似乎只想获取所选选项的值。 你能试试吗？

$(document).ready(function() {
    $('.options').click(function() {
        var optionsArray = [];
        $('.options input:checked').each(function() {
            optionsArray.push(this.name);
        });
        // now optionsArray has all your options
    });
});