Question

我在php中有一个循环，每个项目都会生成一个打开灯箱的链接。如何以可以在灯箱和表单提交中使用它的方式传递与当前迭代相关的数据（例如userid）？

<?php
foreach ($results as $viewUser)
    {
            if ($viewUser)
            {
                echo '<a class="change-email" href="#">Change Email</a>';
            }
    }
}
?>

<script>
$(function(){
    $(".change-email").click(function(){

            $.fancybox({
                'href'              : '#change-email-dialog',
                'width'             : '200px',
                'height'            : 'auto',
                'autoScale'         : true,
                'transitionIn'      : 'fade',
                'transitionOut'     : 'fade',
                'type'              : 'inline',
                'modal'             : false,
                'afterShow'         : function () {

                }
            });
        });
});   
</script>

<div id="change-email-dialog">
    <form id="change-email-form" class="table" method="POST" action="<?php echo site_url('customerservice/changeEmail').'user='.$viewUser->getBusID(); ?>">
        <ul class="table-row">
            <li class="table-cell">New Email</li>
            <li class="table-cell"><input type="text" name="newEmail" /></li>
        </ul>
        <ul class="table-row">
            <li class="table-cell">Notify Contract Entry?</li>
            <li><input type="checkbox" checked="checked" name="notify" /></li>
        </ul>

        <ul class="table-row">
            <li><input name="userSearchSubmit" type="submit" value="Save" /></li>
        </ul>

    </form>  
</div>

Answer 1

您可以将任何数据添加到html中

echo '<a class="change-email" href="#" data-userid="$viewUser.id">Change Email</a>';

稍后用js

拉出来

$(this).data('userid')

Answer 2

您可以使用数据属性。

将它们添加到您的php ..

echo '<a class="change-email" href="#" data-userid=".$userID.">Change Email</a>';

..然后你可以在javascript中轻松访问它们。

this.dataset.userid

Answer 3

<?php
    foreach ($results as $viewUser)
        {
                if ($viewUser)
                {
                    echo '<a data-user="<?=$viewUser->userId?>" class="change-email" href="#">Change Email</a>';
                }
        }
    }
    ?>
<script>
$(function(){
    $(".change-email").click(function(){
            var user = $(this).data("user");

            $.fancybox({
                'href'              : '#change-email-dialog',
                'width'             : '200px',
                'height'            : 'auto',
                'autoScale'         : true,
                'transitionIn'      : 'fade',
                'transitionOut'     : 'fade',
                'type'              : 'inline',
                'modal'             : false,
                'afterShow'         : function () {
                     $("#user_input").val(user);
                }
            });
        });
});   
</script>

<div id="change-email-dialog">
    <form id="change-email-form" class="table" method="POST" action="<?php echo site_url('customerservice/changeEmail').'user='.$viewUser->getBusID(); ?>">
        <input id="user_input" type="hidden" name="user" value="" />
        <ul class="table-row">
            <li class="table-cell">New Email</li>
            <li class="table-cell"><input type="text" name="newEmail" /></li>
        </ul>
        <ul class="table-row">
            <li class="table-cell">Notify Contract Entry?</li>
            <li><input type="checkbox" checked="checked" name="notify" /></li>
        </ul>

        <ul class="table-row">
            <li><input name="userSearchSubmit" type="submit" value="Save" /></li>
        </ul>

    </form>

Answer 4

您的JavaScript查询有机会返回多个结果

更改为

$(function(){
    $(".change-email").each(function() {
        $(this).click(function(){
            $.fancybox({
                'href'              : '#change-email-dialog',
                'width'             : '200px',
                'height'            : 'auto',
                'autoScale'         : true,
                'transitionIn'      : 'fade',
                'transitionOut'     : 'fade',
                'type'              : 'inline',
                'modal'             : false,
                'afterShow'         : function () {

                }
            });
        });
    });  
});

Answer 5

扩展我的评论，您可以从javascript中删除.click事件，然后离开该功能。然后，您将在HTML中的onclick事件上调用该函数，同时还传递您的变量。它看起来像这样

<?php
foreach ($results as $viewUser)
    {
            if ($viewUser)
            {
                echo '<a class="change-email" href="#" onclick="changemail(' . $myid . ');">Change Email</a>';
            }
    }
}
?>

<script>
function changemail(myid){
$.fancybox({
    'href'              : '#change-email-dialog',
    'width'             : '200px',
    'height'            : 'auto',
    'autoScale'         : true,
    'transitionIn'      : 'fade',
    'transitionOut'     : 'fade',
    'type'              : 'inline',
    'modal'             : false,
    'afterShow'         : function () {

    }
}
</script>

javascript中的myid包含PHP中包含的任何$myid。

将php数据发送到javascript点击事件

5 个答案: