在Jquery Ajax中使用选择器和$（this）

Question

我有事件mouseenter链接与获取ajax请求，我想获得选择器$(this)的链接和获取属性。 我使用为AJAX回调设置ajax的context 。

jQuery(document).ready(function($) {
  var request;
  $('a[rel="bookmark"]').mouseenter(function() { 
  // other stuff
  request = $.ajax({
      dataType: "JSON",
      url: '<?php echo admin_url("admin-ajax.php"); ?>',
      data: {"action": "our_ajax_function", "id": dataId},
      context: $(this).parent().get(0),
      success: function(data){
          // other stuff
          var gettitle = $(this).attr('data-title').replace('Permanent Link to ','');
      }
  })
});

但是我得到了这个错误

Uncaught TypeError: Cannot read property 'replace' of undefined 

我有事件mouseenter链接与获取ajax请求，我想获得选择器$(this)的链接和获取属性。 我使用为AJAX回调设置ajax的context 。

jQuery(document).ready(function($) {
  var request;
  $('a[rel="bookmark"]').mouseenter(function() { 
  // other stuff
  request = $.ajax({
      dataType: "JSON",
      url: '<?php echo admin_url("admin-ajax.php"); ?>',
      data: {"action": "our_ajax_function", "id": dataId},
      context: $(this).parent().get(0),
      success: function(data){
          // other stuff
          var gettitle = $(this).attr('data-title').replace('Permanent Link to ','');
      }
  })
});

但是我得到了这个错误

Uncaught TypeError: Cannot read property 'replace' of undefined 

HTML

<ul>
   <li>
    <a href="http://localhost/area-no-kishi/" rel="bookmark" data-title="Permanent Link To Area no Kishi" data-id="4126" target="_blank">Area no Kishi </a>
   </li>
   <li>
    <a href="http://localhost/aria-the-scarlet-ammo-hidan-no-arai/" rel="bookmark" data-title="Permanent Link To Permanent Link to Aria the Scarlet Ammo ( Hidan No Aria )" data-id="1081" target="_blank">Aria the Scarlet Ammo ( Hidan No Aria ) </a>
   </li>
</ul>

Answer 1

尝试将“this”分配给变量：

jQuery(document).ready(function($) {
  var request;
  $('a[rel="bookmark"]').mouseenter(function() { 
  var that=this;
  // other stuff
  request = $.ajax({
      dataType: "JSON",
      url: '<?php echo admin_url("admin-ajax.php"); ?>',
      data: {"action": "our_ajax_function", "id": dataId},
      success: function(data){
          // other stuff
          var gettitle = $(that).data('title','Permanent Link to ');
      }
  })
});

在使用HTML5数据属性时，您可以使用data()函数获取或修改jQuery中的data() ：

$(that).data('title','Permanent Link to '); //sets the "data-title" of the selected element as "Permanent Link to "

Answer 2

如果你想this回调里面指的是a元素（即该元素的处理程序绑定到），使用

context: this

代替

context: $(this).parent().get(0)

$(this).parent().get(0)选择a元素的父元素，它是一个li元素，它似乎没有data-title属性。

从文档 ：

上下文
此对象将成为所有与Ajax相关的回调的上下文。 默认情况下，上下文是一个对象，表示调用中使用的ajax设置（ $.ajaxSettings与传递给$.ajax的设置合并）。 例如，将DOM元素指定为上下文将使得请求的完整回调的上下文，如下所示：

 $.ajax({ url: "test.html", context: document.body }).done(function() { $( this ).addClass( "done" ); }); 

---

另见$（this）内部的AJAX成功无效