0

我是 JavaScript 新手。现在我想从 html 标签中获取值（从数据库中获取值）。如果只有一条从数据库中获取的记录，那么我的代码是有效的。但如果有多个记录，则没有工作，只有先记录该工作。

这是代码 * PHP *

$sql = mysql_query("SELECT * FROM users"); //suppose, there are 5 records
while($row = mysql_fetch_array($sql)){
    //fetch value from db
    $u_name = $row['U_Name'];
    $u_gender = $row['Gender'];
    $u_email = $row['Email'];

    echo "<div class='loop'>";
        echo "<p><input type='radio' name='user' value='1' />Name</p>
              <p><input type='radio' name='user' value='2' />Gender</p>
              <p><input type='radio' name='user' value='3' />Email</p>";

    //user info
        echo "<div class='user_info'>";
            echo "<input type='hidden' class='u_name' value='$u_name' />";
            echo "<input type='hidden' class='u_gender' value='$u_gender' />";
            echo "<input type='hidden' class='u_email' value='$u_email' />";
        echo "</div>";

    //button
        echo "<div class='user_button'>";
            echo "<a style="text-decoration: none; color: #000000;"
                   class="button_action" id="button_action" href="#"
                   onclick="return false;">Info</a>";
        echo "</div>";                           

    //save final result
        echo "<input type='hidden' id='final_name' value='' />";
        echo "<input type='hidden' id='final_gender' value='' />";
        echo "<input type='hidden' id='final_email' value='' />";

    echo "</div>";
}

当用户选择哪个单选按钮，并单击信息按钮时，它将提醒用户的信息。

if user choose radio Name and click button Info --> alert name of user
if user choose radio Gender and click button Info --> alert gender of user
if user choose radio Email and click button Info --> alert email of user

一次，用户选择或更改单选按钮，我会将用户的值转移到保存最终结果的点（在我的 php 代码中）。

Javascript（当用户更改单选按钮时）

$('input[name=user]').bind('change', function(){
    var n = $(this).val();
    switch(n){
        case '1':
            var name = $(this).parents('.loop').find("u_name").val();
            document.getElementById("final_name").value = name;
            break;
        case '2':
            var gender = $(this).parents('.loop').find("u_gender").val();
            document.getElementById("final_gender").value = gender;
            break;
        case '3':
            var email = $(this).parents('.loop').find("u_email").val();
            document.getElementById("final_email").value = email;
            break;
    }
});

这是用户现在单击按钮信息时的操作 ，我只提醒名称

$(".button_action").bind('click', function(){
    var u_name = $(this).parents('.loop').find("#final_name").val();
    var u_gender = $(this).parents('.loop').find("#final_gender").val();
    var u_email = $(this).parents('.loop').find("#final_email").val();
    alert(u_name);
});

此代码仅更正从数据库中获取的第一条记录。其他记录，无法取值。您能帮忙修改或更改我的代码为正确的吗？

预先感谢。

4

1 回答 1

0

这是因为您使用了重复的 id 值，元素的 ID 必须是唯一的。在这种情况下，您需要为隐藏元素使用名称而不是 ID

    echo "<input type='hidden' name='final_name' value='' />";
    echo "<input type='hidden' name='final_gender' value='' />";
    echo "<input type='hidden' name='final_email' value='' />";

然后

$('input[name=user]').bind('change', function () {
    var n = $(this).val(),
        $loop = $(this).closest('.loop');
    switch (n) {
        case '1':
            var name = $loop.find('input[name="u_name]').val();
            $loop.find('input[name="final_name]').val(name);
            break;
        case '2':
            var gender = $loop.find('input[name="u_gender]').val();
            $loop.find('input[name="final_gender]').val(gender);
            break;
        case '3':
            var email = $loop.find('input[name="u_email]').val().val();
            $loop.find('input[name="final_email]').val(email);
            break;
    }
});

$(".button_action").bind('click', function(){
    var $loop = $(this).closest('.loop');
    var u_name = $loop.find('input[name="final_name]').val();
    var u_gender = $loop.find('input[name="final_gender]').val();
    var u_email = $loop.find('input[name="final_email]').val();
    alert(u_name);
});
于 2013-11-04T03:07:42.120 回答