0

我有一个页面，下面有一个下拉菜单和一个 div。根据您从菜单中选择的内容，这决定了 div 中加载的内容。我需要 div 中动态调用的内容才能知道选择了哪个菜单值。它还需要能够检索在加载动态内容时可以更改的其他下拉菜单值。

一旦从动态内容区域内单击提交按钮，所有这些值都需要被抓取。我正在尝试使用 jquery 中的 .parent() ，但我有一种行不通的感觉，因为我还不能让它工作。

任何有关如何从外部动态加载的内容中获取输入字段值的建议和帮助将不胜感激。

这是主页上的 Jquery 和 Html：

<script>
$(document).ready(function() {

    $("#men2link").click(function(){
         $.ajax({ url: 'pages/abc.php', success: function(html) {
            $("#subajax-content").empty().append(html);
            }
        });
    });
});
</script>

<table>
    <tr>
      <td>
            <table>
                <tr>
                    <td>Menu 1:</td>
                    <td>
                        <select name="men1" id="men1">
                            <option>Select Option</option>
                            <option value="o1">option1</option>
                            <option value="o2">option2</option>
                            <option value="o3">option3</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td id="men2link">Menu 2</td>
                    <td>        
                        <select name="men2" id="men2">
                            <option>Select Option</option>
                            <option value="r">Received</option>
                            <option value="nr">Not Received</option>
                            <option value="na">Not Applicable</option>
                        </select>
                    </td>
                </tr>
            </table>
      </td>
      <td class="align-top"><div id="subajax-content"></div></td>
    </tr>
</table>

动态加载到 subajax-content div 中的 Html 和 JQuery

<script>
$(document).ready(function() {
    $("#save").click(function(){
       alert($("#home").parent("#men2").val());
    });
});
</script>
4

2 回答 2

0

您可以使用“closest()”而不是 parent()，因为它不是那么严格

于 2012-07-03T10:33:38.280 回答
0

首先，使外部表可识别。对于唯一的表，您可以使用 id 或重复表，使用类：

<table id="outerTable">
<!-- or -->
<table class="outerTable">

现在你只需要一个 jQuery 块。这将响应动态插入的内容，因此无需再提供任何带有内容的 javascript/jQuery。

$(document).ready(function() {

    //This part is unchanged
    $("#men2link").click(function() {
        $.ajax({
            url: 'pages/abc.php', 
            success: function(html) {
                $("#subajax-content").empty().append(html);
            }
        });
    });

    //This part is a modified version of what was previously delivered with the dynamic content
    //For use with id="outerTable"
    $("#outerTable").on('click', "#save", function() {
        var $outerTable = $(this).closest(".outerTable"),
            val1 = $outerTable.find("#men1").val(),
            val2 = $outerTable.find("#men2").val();
        alert([val1, val2]);
    });
});

笔记：

  • 重复外部表的代码将略有不同，每个外部表都有自己的内部表。
  • 对于在唯一的外部表中重复内部表，代码将略有不同。
  • 对于重复外部表或重复内部表，选择菜单和保存按钮也应该有类而不是 id。
于 2012-07-03T11:23:15.540 回答