我需要执行以下代码,而不刷新页面...这段代码已经包含了ajax,但是如果在没有刷新页面的情况下执行它我会出错...? .vote类被附加到我的index.php文件中的一个锚点,如果可能的话,单击锚点时我需要全部工作。对此进行重新编码以便在按钮点击时执行并不理想。
$(".vote").click(function() {
var id = $(this).attr("id");
var name = $(this).attr("name");
var eData = $(this).attr("data-options");
var dataString = 'id='+ id + '&' + eData ;
var parent = $(this);
if(name=='up')
{
$(this).fadeIn(200).html('');
$.ajax({
type: "POST",
url: "up.php",
data: dataString,
cache: false,
success: function(html){
parent.html(html);
}
});
}
else
{
$(this).fadeIn(200).html('');
$.ajax({
type: "POST",
url: "down.php",
data: dataString,
cache: false,
success: function(html){
parent.html(html);
}
});
}
});
这是我的index.php
中的html<div id="main">
<div id="left">
<span class='up'><a href="" class="vote" name="up" data-options="key1=<?php echo $mes_id1;?>&key2=<?php echo $mes_id2;?>"><img src="up.png" alt="Down" /></a></span><br />
<?php echo $totalvotes1; ?><br />
</div>
<div id="message">
<?php echo $message1; ?>
</div>
<div class="clearfix"></div>
</div>
<div id="main">
<div id="right">
<br />
<?php echo $totalvotes2; ?><br />
<span class='down'><a href="" class="vote" name="down" data-options="key1=<?php echo $mes_id1;?>&key2=<?php echo $mes_id2;?>"><img src="down.png" alt="Down" /></a></span>
</div>
<div id="message">
<?php echo $message2; ?>
</div>
<div class="clearfix"></div>
</div>
答案 0 :(得分:1)
您需要使用$(document).ready(function() {});
附上代码,或将代码粘贴在<body>
代码的末尾。就个人而言,不是让浏览器在加载DOM之前解析同步javascript(在<head>
部分中),而是将其贴近最后。这也是Bootstrap推荐的内容。
如果没有加载DOM,则没有为jQuery创建的用于注册事件的元素,因此您的代码在解析之后就无所事事。
除此之外,.click()
函数在点击时执行。它与哪个元素绑定并不重要。如果它是可点击的,那么它是可执行的。
还要正确回答您的问题:<a href="">
将刷新页面。你想使用
<a href="#">
。但是,这会让您跳转到页面顶部。您也可以定义<label>
并使用#labelname
来避免这种情况。或者根本不要使用href
。这不是必需的。
此外,将变量回显到HTML中的一个小技巧是使用<?= $var ?>