Question

我有以下一段javascript。它使用Ajax从API获取引用。报价在报价div处显示，但href未在twitterAnchor刷新。

＆＃13;

    jQuery('#button').on('click', function(){
            
        jQuery.ajax({
        url: "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&  filter[posts_per_page]=1&_jsonp=mycallback",
        type: 'GET',
        dataType: "jsonp",
        success: function(json){
            document.getElementById('quote').innerHTML = json[0].content;
            document.getElementById('twitterAnchor').href =  "https://twitter.com/intent/tweet?text=" + json[0].content;    
            }
        });
    });

＆＃13;

<!-- Here is the anchor. -->

      <div id="tweet">
          <a id ="twitterAnchor" href="" class="twitter-share-button" target="_blank" >Tweet</a>  
      </div>

＆＃13;

当我点击twitterAnchor时，页面会刷新。控制台没有显示任何内容，是否有人暗示发生了什么？

Answer 1

在一天之后试图找到错误......那就是解决方案：

jQuery('#button').on('click', function(){

    jQuery.ajax({
    url: "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&_jsonp=mycallback",
    type: 'GET',
    dataType: "jsonp",
    success: function(json){
        document.getElementById('quote').innerHTML = json[0].content; 
        }
    });
});

jQuery('#twitterAnchor').on('click', function () {
    jQuery(this).attr("href","https://twitter.com/intent/tweet?text=" + document.getElementById('quote').innerHTML);
});

问题是：如果你试图改变ajax连接中的href，它就不起作用了。我真的不知道为什么，我很高兴知道。

Answer 2

不要为href指定新值，而是使用jQuery attr方法。

$('#twitterAnchor').attr('href', 'https://twitter.com/intent/tweet?text=' + json[0].content);

Answer 3

您选择的ID为button，而不是twitterAnchor。所以试试jQuery('#twitterAnchor')

其次，您需要在单击锚点时阻止浏览器的默认行为：

jQuery('#twitterAnchor').on('click', function (e) {
  e.preventDefault();
  jQuery.ajax({
    url: "http://quotesondesign.com/wp-json/posts?filter[orderby]=rand&  filter[posts_per_page]=1&_jsonp=mycallback",
    type: 'GET',
    dataType: "jsonp",
    success: function (json) {
      document.getElementById('quote').innerHTML = json[0].content;
      jQuery(this).attr("href","https://twitter.com/intent/tweet?text=" + json[0].content);
    }
  });
});

href在锚点上不起作用

3 个答案: