0

更新问题：我问错了！如何在 .each 中捕获当前元素的点击事件？我应该将按钮 ID = 分配给该行的当前 eq: ，然后找到一种在单击事件中引用它的方法吗？

还是我应该考虑将：更改FDID: $('.fdid-1').val()为：FDID: $('this.fdid-1').val()

带有按钮的动态表单元素，单击事件未捕获包含按钮的表单 ul。代码会将json发送到php页面进行处理。使用“文档”获取完整页面，需要深入了解元素。

$(document).on("click", ".submit", function(event){
alert($(this).text());

var form_data = {
    FDID: $('.fdid-1').val(),
    CHOICE1: $('.choice-1').val(),
    CHOICE2: $(".choice-2").val()
    };      

$.getJSON("modify.php",form_data,function(data){
    switch(data.retval){
        case 0: $("#status").html("Update successful!");
        break;
        case 1: $("#status").html("Unable to update!");
        break;
        default: $("#description").html("Database error, please try again.");
        break;
        }
});
});

$.each( data, function ( i, val ) {

        ($('<div>')
        .attr({
            'data-role': 'collapsible',
            'data-content-theme': 'c',
            'data-collapsed': 'true',
            'id': 'cResults'
        })
        .html('<h4>' + this.LastName + ', ' + this.FirstName + '</h4>'
        + '<ul data-role="listview" data-filter="true" data-filter-placeholder="Search Choices..." data-inset="true" class="makecollapsibleul">'
        + '<li><form id="productForm" action="modify.php" method="post">'
        + '<label for="fdid-1">FDID:</label>'
        + '<input type="text" name="fdid-1" class="fdid-1" value=' + this.FDID + '>'
        + '</li><li>' 
        + '<label for="text-1">Choice 1:</label>'
        + '<input type="text" name="choice-1" class="choice-1" value=' + this.C1 + '>'
        + '</li><li>' 
        + '<label for="text-2">Choice 2:</label>'
        + '<input type="text" name="choice-2" class="choice-2" value=' + this.C2 + '>'
        + '</li><li>' 
        + 'IP: ' + this.IPADDRESS + '</li><input type="submit" class="submit" value="UPDATE" /></form><li>' 
        + 'Pick Date: ' + this.PICKDATE + '</li>'
        + '</ul>'))
        .appendTo('#primary');

                //$(".title").append('<li>'+orderNum+' -- '+itemNum+'</li>');

        $('#makecollapsible').collapsibleset().trigger('create');
        $.mobile.hidePageLoadingMsg();

HTML：

 <div data-role="page" id="main">      
    <div data-role="header">         
        <h1>JSON DATA</h1>     
    </div><!-- /header -->      

    <div data-role="content">
    <div id="status"></div>
    <div id="description"></div>
    <ul data-role="listview" id="outer-ul">
        <li>  
        <div data-role="collapsible">
            <h4>Submitted Choices</h4> 
            <ul data-role="listview" data-inset="true" data-filter="true" id="makecollapsible">
                <!-- AJAX CONTENT -->
            </ul>
        </div>
        </li>
    </ul>           
    </div><!-- /content -->      

    <div data-role="footer">              
    </div>

</div><!-- /page -->
4

4 回答 4

0

决定使用我的 ul 中的帖子来处理数据 - 不知道为什么我不能直接从元素中获取它。

于 2013-10-13T14:55:47.673 回答
0

当您单击提交按钮时，您应该从具有单击按钮的表单中找到输入。

如果您有多个具有相同类的输入，$(".myClass").val()将返回第一个元素值。

因此，解决方案是获取表单并在表单中查找输入：

$(document).on("click", ".submit", function(event){
    var $form = $(this).closest("form");
    //event.stopPropagation();
    var form_data = {
        FDID: $('.fdid-1', $form).val(),
        CHOICE1: $('.choice-1', $form).val(),
        CHOICE2: $(".choice-2", $form).val()
    };
});
于 2013-10-13T15:04:17.977 回答
0

页面上是否可能有多个具有相同类或 ID 的元素？这会导致你得到错误的元素。

于 2013-10-12T23:50:54.330 回答
0

加载所有元素后尝试添加此代码：

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

提示：尽量避免将html标签混入字符串并从服务器添加数据，您可以使用模板引擎来代替。（如 jquery 模板...）。

于 2013-10-13T00:16:20.340 回答