【发布时间】：2017-11-23 06:50:20
【问题描述】：
我正在创建一个功能，让用户能够点赞状态，一旦被点赞，它就会从竖起大拇指图标变为“点赞”！
我遇到的问题是我在 while 循环中使用它，当我喜欢一个状态（比如说第 2 行），然后我去喜欢另一种状态（比如说第 3 行），它会显示“喜欢！”结果仅在第 2 行。我希望它显示“喜欢！”单击时在两行上。数据库从不同的行接收正确的信息，我只是希望结果也反映在不同的行上。
下面是我的代码：
<?php
if(isset($_SESSION['id'])) {
$sql = "SELECT * FROM user_status WHERE (userid = '$statusposterid') AND (statusid = '$statusid') ";
$result0 = mysqli_query($conn, $sql);
if (mysqli_num_rows($result0) > 0) {
while ($row = mysqli_fetch_array($result0)) {
$statusid = $row['statusid'];
$likerid = $_SESSION['id'];
$sql = "SELECT * FROM user_likes WHERE likerid='$likerid' AND likesid='$statusid'";
$result = mysqli_query($conn, $sql);
$alreadylike = mysqli_num_rows($result);
if (!$alreadylike > 0) {
$sql3 = "SELECT * FROM user_likes WHERE likesid='$statusid'";
$result3 = mysqli_query($conn, $sql3);
$likecount = mysqli_num_rows($result3);
?>
<td style="width: 100px;">
<p align="center">
<div id="contact_form">
<form name="likestatus" action="">
<fieldset>
<input type="hidden" name="likesid" id="likesid" size="30" value="<?php echo $statusid ?>" class="text-input" />
<input type="hidden" name="likerid" id="likerid" size="30" value="<?php echo $_SESSION['id']; ?>" class="text-input" />
<br />
<button style="width: 100%; border: none; background:none!important; background-color: transparent; cursor: pointer;" type="submit" name="likestatus" class="button" id="submit_btn">
<i class="fa fa-thumbs-o-up fa-fw ss-large ss-text-grey"></i>
</button>
</fieldset>
</form>
</div>
<font><?php echo $likecount; ?> likes</font>
</td>
<?php
}
}
}
}
?>
<script>
$(function() {
$(".button").click(function() {
// validate and process form here
});
});
</script>
<script>
$(function() {
$('.error').hide();
$(".button").click(function() {
// validate and process form here
$('.error').hide();
var likesid = $("input#likesid").val();
if (likesid == "") {
$("label#likesid_error").show();
$("input#likesid").focus();
return false;
}
var likerid = $("input#likerid").val();
if (likerid == "") {
$("label#likerid_error").show();
$("input#likerid").focus();
return false;
}
var dataString = 'likesid='+ likesid + '&likerid=' + likerid + '&likestatus=' + likestatus;
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "simpletest.php",
data: dataString,
success: function() {
$('#contact_form').html("<div id='message'></div>");
$('#message').html("<h3>Liked!</h3>")
//.append("<p>We will be in touch soon.</p>")
.hide()
.fadeIn(1500, function() {
$('#message').append("");
});
}
});
return false;
});
});
</script></p>
我必须更改代码的顺序吗？我到处寻找可以找到此解决方案的方法，但到目前为止，还没有运气。请记住，我对 javascript 非常陌生。
编辑：
从更多的研究来看，我似乎需要以某种方式为表单设置不同的 ID。我不确定我需要在哪个字段中添加不同的 id，我已经尝试了所有我能想到的不同方法，但还没有达到我想要的结果。
新代码编辑：
<?php
if(isset($_SESSION['id'])) {
$sql = "SELECT * FROM user_status WHERE (userid = '$statusposterid') AND (statusid = '$statusid') ";
$result0 = mysqli_query($conn, $sql);
if (mysqli_num_rows($result0) > 0) {
while ($row = mysqli_fetch_array($result0)) {
$statusid = $row['statusid'];
$likerid = $_SESSION['id'];
$sql = "SELECT * FROM user_likes WHERE likerid='$likerid' AND likesid='$statusid'";
$result = mysqli_query($conn, $sql);
$alreadylike = mysqli_num_rows($result);
if (!$alreadylike > 0) {
$sql3 = "SELECT * FROM user_likes WHERE likesid='$statusid'";
$result3 = mysqli_query($conn, $sql3);
$likecount = mysqli_num_rows($result3);
?>
<td style="width: 100px;">
<p align="center">
<div class="contact_form">
<fieldset>
<!-- removed id attribute -->
<input type="hidden" name="likesid" size="30" value="<?php echo $statusid ?>" class="text-input" />
<input type="hidden" name="likerid" size="30" value="<?php echo $_SESSION['id']; ?>" class="text-input" />
<br />
<!-- removed id attribute -->
<!-- replaced type attribute as you are not submitting really -->
<button style="width: 100%; border: none; background:none!important; background-color: transparent; cursor: pointer;" type="button" name="likestatus" class="button"><i class="fa fa-thumbs-o-up fa-fw ss-large ss-text-grey"></i></button>
</fieldset>
</div>
<font><?php echo $likecount; ?> likes</font>
</td>
<?php
}
}
}
}
?>
<script>
$(function() {
// get into the habit of caching the elements you will be re-using
var error = $('.error');
$('.button').click(function () {
error.hide();
// cache all the elements we'll be using
var contactForm = $(this).closest('.contact_form'),
likesid = contactForm.find('input[name=likesid]'),
likerid = contactForm.find('input[name=likerid]');
likestatus = contactForm.find('button[name=likestatus]');
if (likesid.val() == '') {
// ...
likesid.focus();
return false;
}
if (likerid.val() == '') {
// ...
likesid.focus();
return false;
}
// easier to use object rather than string
// not sure where likestatus came from so it is ommitted
var data = { likesid: likesid.val(), likestatus: likestatus.val(), likerid: likerid.val() };
// short-hand method for $.ajax with POST
$.post('simpletest.php', data, function (res) {
// the rest
});
// no need to do any return false
});
});
</script></p><br>
【问题讨论】：
-
你的 HTML 有效吗？
-
是的，html是有效的
-
您不能有两个具有相同 ID 的元素。这会打乱你的 AJAX 调用。
-
我怎样才能通过循环改变id？我试图通过在末尾添加 来更改 id 名称，但它给出了相同的结果
-
诀窍是不使用我的答案中显示的 ID。
标签： javascript php ajax