Question

我有这样的代码：

<?php
$username = 'johndoe';
?>

<head>
<script>
...
$('a.manage-content-link').click(function (e) {
    var self = $(this),
        file = self.siblings('input[type="hidden.block-hidden-input"]').val();
    self.next(".manage-content-wrap").find(".manage-content").load("file-" + file + ".php");
    e.preventDefault();
});
...
</script>
</head>

<body>
...
<li><input type="hidden" value="001" class="block-hidden-input" />
    <a href="#" id="manage-1" class="manage-content-link">
        <img src="images/web-block/web-block1.jpg"/>
        <span class="orange-notice">Click to Edit Content</span>    
    </a>
</li>

<li><input type="hidden" value="002" class="block-hidden-input" />
    <a href="#" id="manage-2" class="manage-content-link">
        <img src="images/web-block/web-block2.jpg"/>
        <span class="orange-notice">Click to Edit Content</span> 
    </a>
</li>
...
</body>

正如你在那里看到的，每当用户点击“manage-content-link”类时，无论是manage-1，manage-2，...还是manage-X（多个li标签），jQuery都会加载“file- XXX.php”。其中XXX实际上是li标签中隐藏输入的值。

但是“file-XXX.php”需要PHP标签和ID本身的$ username，即“manage-X”。如何传递“file-XXX.php”所需的2个变量，一个来自PHP，另一个来自ID？

Answer 1

使用jQuery的.ajax()代替.load()：http://api.jquery.com/jQuery.ajax/

$('a.manage-content-link').click(function (e) {
    var self = $(this),
        file = self.siblings('input[type="hidden.block-hidden-input"]').val(),
        this_id = self.attr('id');

    $.ajax({
      url: "file-" + file + ".php",
      data: { username: "<?php echo $username;?>", id: this_id },
      context: this,
      success: function(data) {
        $(this).next(".manage-content-wrap").find(".manage-content").html(data);
      }
    });
    e.preventDefault();
});

如果你想让脚本保持外部，你不能依赖php来回显脚本里面的$ username。因此，您可以通过几种方式添加用户名。您可以在页面中的某个位置创建隐藏输入，其值等于用户名;您可以将用户名作为data-username属性附加到元素（如正文）;或者你可以在标题中有一个纯粹定义用户名的脚本块。例如：

<input type="hidden" name="username" value="<?php echo $username;?>>

或者：

<body data-username="<?php echo $username;?>">

或者：

<head>
    <script>
        var username = "<?php echo $username;?>";
    </script>
</head>

Answer 2

在<body>中，您可以添加隐藏字段

<input type="hidden" value="<?=$username?>" id="username" />

并在你的jquery中，

$('a.manage-content-link').click(function (e) {
    var self = $(this),
    file = self.siblings('input[type="hidden.block-hidden-input"]').val();
    var username = $("username").val(); //use this variable where ever you want
    var ids = $(this).attr('id'); // this is the id
    self.next(".manage-content-wrap").find(".manage-content").load("file-" + file + ".php?id="+ids+"&username="+username);  //and in php file usee $_GET
    e.preventDefault();
});

Answer 3

$('a.manage-content-link').click(function (e) {
    var self = $(this);
        file = self.prev('.block-hidden-input').val();
       self.next(".manage-content-wrap").find(".manage-content").load("file-" + file + ".php");
    e.preventDefault();
});

我建议您在会话中存储用户名并使用$_SESSION['username']在php中获取该值，而不是从脚本中传递用户名，否则将来会导致安全问题。

DEMO

如何在jQuery Load上传递PHP变量？

3 个答案: