Question

我是javascript的新手。我想在javascript中执行像分页这样的任务。这是我的代码。

for(var i=1;i<=total_guest;i++)
{   
$("#Personal"+i).find("#Personal_details ").show();
$('#Personal'+i).find('.personal_info').click(function(e){
    alert(i);
        e.preventDefault();
        $("#Personal"+i).find("#Personal_details ").hide();


    }); 
}

说明：

在循环中，我得到total_guest值（例5）。在开始时我想获得第一位客人的页面。当我点击下一个按钮（class ='personal_info'）时，我应该向下一位客人显示页面，如明智到第5位客人。

任何人都可以提供解决方案吗？

编辑以包含HTML：

<div id='Personal1' > 
    <div id='Personal_details'> 
        <div class='personal_info'>button for next step</div> 
    </div> 
</div> 
<div id='Personal2' > 
    <div id='Personal_details'> 
        <div class='personal_info'>button for next step</div> 
    </div> 
</div>

Answer 1

为了让你的循环工作，你需要一个闭包来保持i的值在click函数中保持不变，但这一切似乎都是不必要的，就像你可以做的那样：

$(".Personal_details").show().on('click', function(){
    $(this).hide();
});

请注意，ID是唯一的，.find(someID)没有意义，因为只有一个元素具有该ID。

编辑：根据新的HTML，这是一个错误！您不能两次（或更多）具有相同的ID。

<div id='Personal1' > 
    <div class='Personal_details'> 
        <div class='personal_info'>button for next step</div> 
    </div> 
</div> 
<div id='Personal2' > 
    <div class='Personal_details'> 
        <div class='personal_info'>button for next step</div> 
    </div> 
</div>

Answer 2

尝试这个，将id更改为类，例如id="Personal1" to class="personal"然后

$('document').ready(function() {

    $('.personal').click(function() {
           $(this).children('.personal-details').show();
    });

    $('.personal_info').click(function() {
           $(this).parent().hide();
           $(this).parent().parent().next().children('.personal-details').show();
    });
});

for循环中的jquery'Click'事件

2 个答案: