我有一个表格,其中列出了一些评论。评论旁边有两个链接,隐藏
和显示
。所以我想做的是当点击正确的链接时用ajax更改评论的状态。
// inside a loop for showing all comments
<div class="pull-right" class="publish-history-comment">
<a href="#" data-time="<?= $row->time; ?>" class="publish-history-comment-link" onclick="toggleHistoryNotes('publish');">Publish</a>
</div>
<div class="pull-right" class="hide-history-comment">
<a href="#" data-time="<?= $row->time; ?>" class="hide-history-comment-link" onclick="toggleHistoryNotes('hide');">Hide</a>
</div>
<?= $row->comment; ?>
<script type="text/javascript">
function toggleHistoryNotes(status) {
var link = $('.' + status + '-history-comment-link');
var time = link.attr('data-time');
alert(time);
}
</script>
如何定位被点击的链接并执行 ajax 调用来切换评论状态?
最佳答案
您可以将 JQuery 更改为在点击 a
标记时触发。另外,您应该添加 e.preventDefault();
因为这将点击 a
标记,这会阻止默认操作。
$('.pull-right a').on('click', function(e) {
e.preventDefault();
var time = $(this).data('time');
console.log($(this).text() + ' == ' + time);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pull-right" class="publish-history-comment">
<a href="#" data-time="2133124356354" class="publish-history-comment-link">Publish</a>
</div>
<div class="pull-right" class="hide-history-comment">
<a href="#" data-time="2465433141212123" class="hide-history-comment-link">Hide</a>
</div>
关于javascript - 单击链接隐藏/显示内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45186504/