Question

我正在尝试使用jQuery在页面上加载一个按钮，当有人点击该按钮时，我希望onclick函数发生，并将id值保存在本地存储中。

然而，当登录到控制台时，这会给我一个空值！这是错的吗？我怎样才能做到这一点？

var str = '<div class="row">
   <div class="col-md-4">  
   <div class="thumbnail"> 
   <img src="' + poster + '"alt="Poster_here">
   <div class="caption"><h3>' + title +'</h3><p>' + desc + '</p><p>
   <a href="" class="btn btn-primary" role="button" 
   script="onclick()=function(){localStorage.setItem("idd","' + 
   id + '");' +'}">Read More and Explore</a> </p></div></div></div>
   </div>';
   $('#add_all_here').append(str);

HTML： -

<div class="container-fluid">
    <div id="add_all_here">

    </div>
</div>

Answer 1

您的代码按预期运行。
我想我知道是什么导致你认为它没有运行。
<a>代码中的这一行：script="onclick()=function(){localStorage.setItem("idd","' + id + '") 这不是附加事件处理程序的方法。

您需要使用事件的名称传递对该属性的函数引用所以而不是script=onclick... 它应该是：onclick='functionName(event)'
另一件事是，您需要阻止重定向到网站，以便在本地存储中设置内容，然后重定向客户端。
因此，您可以使用event.preventDefault()停止重定向，然后从href属性中获取网址并设置window.location。

以下是修改过的代码的一个工作示例（我无法在代码段中使用本地存储，因此我使用了console.log）：

＆＃13;

function setLocalStorage(e){
  e.preventDefault();
  var id = e.target.getAttribute('data-id');
  var url = e.target.href;
  console.log('saving id - ' + id);
  console.log('redirecting to - ' + url);
  //window.location = url; //this will redirect
}

var poster = 'sdsd',
    title = 'blah',
    desc= 'skjdksdj ksjd ',
    id= 457

var str = '<div class="row"><div class="col-md-4">  <div class="thumbnail"> <img src="' + poster + '"alt="Poster_here"><div class="caption"><h3>' + title +'</h3><p>' + desc + '</p><p><a href="http://example.com" class="btn btn-primary" data-id="' + id + '" role="button" onclick="setLocalStorage(event)">Read More and Explore</a> </p></div></div></div></div>';
$('#add_all_here').append(str);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container-fluid">
    <div id="add_all_here">

    </div>
</div>

＆＃13;

使用本地存储和JQuery保存null

1 个答案: