jQuery不替换html按钮与文本为超过一个用户


jQuery not replacing html button with text for more than 1 user

我用jQuery和PHP编写了这段代码:

<script type="text/javascript">
$(document).ready(function(){
  $(".vote<?php echo $pid; ?>").click(function(){
  $("span.vote_box<?php echo $pid; ?>").html("you have voted");
  });
});
</script>

但它似乎不起作用。它应该做的是在一个按钮的位置打印"你已经投票了",用户可以使用这个按钮来投票一些帖子。它在开始时反应良好,但当我以不同的用户登录时,按钮保持不变,不会被替换。

下面是PHP和HTML部分:

<?php
echo '<span class="vote_box'.$pid.'">';
echo '<input type="button" class="vote'.$pid.'" name="vote" value="vote"/>';
echo '</span>';
?>

注意:我使用AJAX请求将投票插入到数据库中,所以实际上我想要jQuery做的就是用文本

替换按钮

帮忙吗?我是jQuery的新手,所以我认为我使用的"html"方法可能是错误的。提前感谢!

我认为你的代码过于复杂了。假设您有以下html:

<span class="vote_box1">
  <input type="button" class="vote1 vote" name="vote" value="vote"/>
</span>
<span class="vote_box2">
  <input type="button" class="vote2 vote" name="vote" value="vote"/>
</span>

和以下javascript:

$(function(){
  $('input.vote').click(function(e){
    $(this).parent().html('You have voted!');
  });  
});

一切都应该正常工作,如本示例所示。如果你还想使用你的代码,你必须开始调试。

根据我的经验,如果某些东西在jQuery中不起作用并且无声地失败(这意味着没有抛出异常),那么选择器是不正确的。您可以使用以下代码轻松地调试它:

<script type="text/javascript">
$(document).ready(function(){
  alert('Button: ' +  $(".vote<?php echo $pid; ?>").length);
  $(".vote<?php echo $pid; ?>").click(function(){
    alert('Votebox: ' +  $("span.vote_box<?php echo $pid; ?>").length);
    $("span.vote_box<?php echo $pid; ?>").html("you have voted");
  });
});
</script>

这应该提示:

  • 按钮:1
  • Votebox: 1

如果这些值中有一个为0,则表示选择器为false

因为$pid变量是一个"字符串",所以很有可能有非法字符干扰jQuery选择器。这就是为什么它可能对一个用户有效而对另一个用户无效的原因——在这种情况下,单个单词、字母数字单词作为$pid可以很好地工作,但其他变量可能不行。

例如:

$pid is 'admin':

<span class="vote_boxadmin">...
$("span.vote_boxadmin").html(...);   //valid selector

$pid is 'some user':

<span class="vote_boxsome user">...
$("span.vote_boxsome user").html(...);  //looking for <user> child of span.vote_boxsome

另一个有趣的场景是当$pid是一个电子邮件地址时。<span class="user@example.com">是有效的HTML5,但jQuery不会正确选择它。

如果没有看到实际的JS/HTML输出,就无法确定。我要从这里开始看