javascript - 防止将重复的商品添加到购物篮中

Question

我在 PHP 表单中创建了一个篮子，用户可以将他们选择的电影插入其中。

问题:

如何防止向此购物篮(选定的电影列表)添加重复的电影？

这是我的代码:(抱歉，我没有粘贴所有代码，因为它太长了)

<div id="basket">
   <div id="basket_left">
       <h4>Selected Movies</h4>
       <img id="basket_img" src="http://brettrutecky.com/wp-content/uploads/2014/08/11.png" />
   </div>
   <div id="basket_right">
       <div id="basket_content">
          <span style="font-style:italic">Your list is empty</span>
       </div>
   </div>
</div>

<script type="text/javascript">
var master_basket = new Array();
$(document).ready(function () {$("input[id='selectType']").change(function(){

 // AUTO_COMPLETION PART

$('#btnMove').on('click', function(d) {
    console.log(master_basket);
    d.preventDefault();
    var selected = $("#q").val();
    if (selected.length == 0) {
        alert("Nothing to move.");
        d.preventDefault();
    } else {
        var obj = {
            "movie_name":selected,
               "movie_info": ""
          };
        addToBasket(obj);
    }
    $("#q").val("");
  });
});

function addToBasket(item) {
       master_basket.push(item);
       showBasketObjects();
    }
function showBasketObjects() {
       $("#basket_content").empty();
       $.each(master_basket, function(k, v) {
             $("#basket_content").append("<div class='item_list'>" + v.movie_name + "<a class='remove_link' href='" + k + "'><img width='20' src='http://i61.tinypic.com/4n9tt.png'></a></div>");
       });

Answer 1

我个人不建议使用 javascript 来防止这种重复，因为任何人都可以修改它并手动导致此问题，您应该防止 php 和 javascript 中的重复。

无论如何，为了在脚本中完成你想要的事情，我认为将部分代码修改为这样就足够了:

var master_basket = new Array();
selectedMovies = {};

  ///////

} else {
    var obj = {
        "movie_name":selected,
           "movie_info": ""
      };
    if(!selectedMovies.hasOwnProperty(selected)){
        addToBasket(obj);
        selectedMovies[selected] = obj;
    }
}