Question

我想使用jQuery在data-href中的url后面添加一个字符串。我想确保我的Facebook评论插件为每个加载评论插件的页面创建一个单独的线程。

在data-href url为?st=<?php echo $post->post_name;?>之后应该添加什么 - 但不确定如何在PHP中将其从WordPress实现为jQuery代码。

现在：

<div class="fb-comments" data-href="https://myurl.com" data-width="100%" data-numposts="3" data-colorscheme="light"></div>

使用post_slug作为WordPress为每个帖子创建的slug应该是什么样子。

<div class="fb-comments" data-href="https://myurl.com/?st=post_slug" data-width="100%" data-numposts="3" data-colorscheme="light"></div>

Answer 1

// Select all elements. It seems they are multiple.
var elems = $('fb-comments'); 

// Get first or you can iterate over above array.
var elem = elems[0];

// Append whatever text you want.
//    `$(elem).data('href')` gets current value.
//    `$(elem).data('href', 'new_val')` sets current value.
$(elem).data('href', $(elem).data('href') + '?st=<?php echo $post->post_name;?>');

Answer 2

获取链接

var link = document.document.getElementById("fb-comments");

更改属性

link.setAttribute('data-href', "new one");

您可以使用getAttribute()获取原始内容并进行编辑。 在html中将“class”更改为“id”。

Answer 3

使用jquery：

var str = "new url";

$(".fb-comments").prop("data-href",str);

Answer 4

您需要使用json_encode - 这将返回值的JSON表示。然后，您可以使用jQuery操作data-href。

下面的例子。

$(document).ready(function() {
      // convert the value
      var value = <?php echo json_encode($post->post_name); ?>
      // get the existing value of data-href
      var href = $('.fb-comments').attr('data-href');
      // create new link with extending php value 
      var newLink = href + '?st=' + value;
      // change the data-href value
      $(".fb-comments").attr('data-href',encodeURIComponent(newLink));
    });

Answer 5

如果你的页面中有jQuery，那么你可以使用这个脚本块：

<script>
    jQuery(function($){
        $('.fb-comments').each(function(){ // loop if there are more blocks
           var oldDataHref = $(this).data('href'); // get the data-href of current "fb-comments"
           var newDataHref = oldDataHref + '?st=<?php echo $post->post_name;?>'; // make a new data-href
           $(this).attr('data-href', newDataHref); // set the data-href here.
        });
    });
</script>

将查询字符串添加到data-href

5 个答案: