使用jQuery或JavaScript从Cookie中删除特定数据



我正在操纵cookie数据以进行日历。我已经在cookie中的数组,使用了桌子。现在,我想从行的最后一列的最后删除按钮删除表行。

我的代码如下

$cookie_data = '2017-06-27+06:00-06:30,2017-06-29+12:00-12:30,2017-07-01+06:00-12:00-17:00 ';
echo '<table class="table table-bordered"  id="schedule">
<tr>
<th>Date</th>
<th>Times</th>
<th>Delete</th>
</tr>';
$val = $cookie_data;
$num_dates = explode(',',$val);
foreach($num_dates as $k => $v){
    $bdata = explode('+',$v);
    echo '<tr><td><label>'.$bdata[0].'</label></td><td><label>'.$bdata[1].'</label></td><td><button>Delete</button></td></tr>';
}
echo '</table>';

也在phpfiddle上运行代码。

http://phpfiddle.org/main/code/8ch0-merp

现在我想通过单击删除按钮删除任何值。

尝试一下,

当前它将在小提琴中出现错误。因为Stackoverflow不允许设置自定义cookie。因此,您可以在自己的身边尝试此代码,也可以在html中转换代码,因此您必须在php中转换。

您可以按照您的需要设置cookie名称,我只是在这里举例。

希望这对您有帮助:(

$("button").on("click",function() {
    var cookieStr = $(this).attr("data-cookie");
    var setCookieVal = [];
    var cookieValue = $("#cookievalue").val().split(",");
    for(i = 0; i< cookieValue.length; i++) {
        if(cookieStr !== cookieValue[i]) {
           setCookieVal.push(cookieValue[i]);
        }
    }
    $.cookie("yourCookie",setCookieVal);
    $(this).parent().parent().remove();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<body>
  <input type="hidden" value="2017-06-27+06:00-06:30,2017-06-29+12:00-12:30,2017-07-01+06:00-12:00-17:00" id="cookievalue">
  <table class="table table-bordered" id="schedule">
	  <tbody>
      <tr>
        <th>Date</th>
        <th>Times</th>
        <th>Delete</th>
      </tr>
      <tr>
        <td><label>2017-06-27</label></td>
        <td><label>06:00-06:30</label></td>
        <td>
          <button data-cookie="2017-06-27+06:00-06:30">Delete</button>
         </td>
      </tr>
      <tr>
        <td><label>2017-06-29</label></td>
        <td><label>12:00-12:30</label></td>
        <td>
          <button data-cookie="2017-06-29+12:00-12:30">Delete</button>           
        </td>
      </tr>
      <tr>
        <td><label>2017-07-01</label></td>
        <td><label>06:00-12:00-17:00 </label></td>
        <td>
          <button data-cookie="2017-07-01+06:00-12:00-17:00">Delete</button>           
        </td>
      </tr>
    </tbody>
  </table>
</body>

  If do you want to delete cookie use $.dough in Jquery Plugin and for this  you should specify name of the cookie like this example :
Create Cookie
//Code Starts
$.dough("cookieName", "cookieValue");
//Code Ends
Read Cookie
//Code Starts
$.dough("cookieName");
//Code Ends
Delete Cookie
//Code Starts
$.dough("cookieName", "remove");
//Code Ends