Php 简单AJAX书签

我在使用PHP的页面上有一个项目列表。我想添加一个简单的AJAX切换，允许用户在浏览列表时将列表中的项目添加到书签中

因此，如果item->bookmark字段=1，那么该项将被添加书签，并且它应该显示一个简单的图像。当他们再次单击它时，它在mysql中变为=“0”，书签图像将变回其他图像

---

在不重新加载页面的情况下，最好的方法是什么？

我觉得您可以在谷歌上搜索“jquery ajax示例”，但现在您可以

HTML:

<div class="container">
    <div class="item" id="<?php echo $whateverYourIdIs; ?>">Bookmark me!</div>
</div>

$(document).ready(function(){
    $('.item', $('.container')).click(function(){
        var id = $(this).attr('id');
        $.ajax({
          type: "POST",
          url: "some.php",
          data: { id: id }
        }).done(function( msg ) {
          alert( "Data Saved: " + msg );
        });
    });
});

---

我觉得你可以在谷歌上搜索“jQueryAjax示例”，但现在你可以

HTML:

<div class="container">
    <div class="item" id="<?php echo $whateverYourIdIs; ?>">Bookmark me!</div>
</div>

$(document).ready(function(){
    $('.item', $('.container')).click(function(){
        var id = $(this).attr('id');
        $.ajax({
          type: "POST",
          url: "some.php",
          data: { id: id }
        }).done(function( msg ) {
          alert( "Data Saved: " + msg );
        });
    });
});

---

AJAX是在服务器上保存数据的方法。但是，如果您想在页面上动态添加/删除书签，您可以使用一个函数，使用data-*属性打开和关闭书签

$(".bookmarkButton").click(function(){
if(! $(this).parent().data('bookmark')){
    alert('bookmarked');
    $(this).parent().data('bookmark', 1);
    // Add image + AJAX call
}
else {
    alert('not bookmarked');
    $(this).parent().data('bookmark', null);
    // Remove image + AJAX call
}

}))

---

这里有一个简单的JSFIDLE:

AJAX是在服务器上保存数据的方法。但是，如果您想在页面上动态添加/删除书签，您可以使用一个函数，使用data-*属性打开和关闭书签

$(".bookmarkButton").click(function(){
if(! $(this).parent().data('bookmark')){
    alert('bookmarked');
    $(this).parent().data('bookmark', 1);
    // Add image + AJAX call
}
else {
    alert('not bookmarked');
    $(this).parent().data('bookmark', null);
    // Remove image + AJAX call
}

}))

下面是一个简单的JSFIDLE：