Question

我正在尝试抓取一个网页并加载到bootstrap 2.3.2 popover中。到目前为止，我有：

$.ajax({
  type: "POST",
  url: "AjaxUpdate/getHtml",
  data: {
    u: 'http://stackoverflow.com'
  },
  dataType: 'html',
  error: function(jqXHR, textStatus, errorThrown) {
    console.log('error');
    console.log(jqXHR, textStatus, errorThrown);
  }
}).done(function(html) {
    console.log(' here is the html ' + html);

    $link = $('<a href="myreference.html" data-html="true" data-bind="popover"' 
            + ' data-content="' + html + '">');
    console.log('$link', $link);
    $(this).html($link);

    // Trigger the popover to open
    $link = $(this).find('a');
    $link.popover("show");

当我激活此代码时，我收到错误：

未捕获的TypeError：无法读取属性＆＃39; createDocumentFragment＆＃39;未定义的

这里有什么问题，我该如何解决？

的 jsfiddle

Answer 1

错误原因是$(this).html($link);回调中的.done()。

回调中的

this是指[...]object that represents the ajax settings used in the call ($.ajaxSettings merged with the settings passed to $.ajax)[...]，而不是$(".btn.btn-navbar")（或者您希望它应该引用的任何内容）。

引发错误是因为当您执行.createDocumentFragment()但在代码中ownerDocument时，jQuery会在内部调用this传递的$(this).html($link);对象上this ownerDocument不是DOMElement，并且没有ownerDocument。因为undefined是createDocumentFragment，这就是为undefined调用ajax的原因。

您需要对{{1}}请求使用context选项。或者您需要将引用保存到要在回调中访问的变量中更改的DOME元素。

Answer 2

发生该错误是因为this指的是ajax对象而不是DOM元素，为了解决这个问题，你可以这样做：

$('form').on('submit', function(){
    var thisForm = this;

    $.ajax({
        url: 'www.example.com',
        data: {}
    }).done(function(result){
        var _html = '<p class="message">' + result + '</p>';
        $(thisForm).find('#resultDiv').html(_html);
    });
});

Answer 3

发生该错误是因为 this 通常指的是 ajax 对象而不是 DOM 元素，以防止在如下变量中分配 this：

/* To add add-on-test in cart */
$(document).on("click", ".aish_test", function(){
          var thisButton = this; //Like this assign variable to this
          var array_coming = '<?php echo json_encode($order_summary_array);?>'; //Json Encoding array intersect variable
          //Converting in array
          var array_check = $.parseJSON(array_coming);
          var result = [];

            for(var i in array_check){
                result.push(array_check [i]);
            }

          //Fetching data:
          var test_data_name = $(this).attr("data-name");
          var test_data_price = $(this).attr("data-price");
          var test_data_id = $(this).attr("data-id");
        
         if($.inArray(test_data_id, result) == -1)
            { 
            //static html 
            var static_html = '<tr><td>'+test_data_name+'</td>';
            static_html += '<td>&#163;'+test_data_price+'</td>';
            static_html += '<td><button type="button" class="close remove_add_test" data-id="'+test_data_id+'" data-price="'+test_data_price+'" aria-hidden="true"> <i class="fa fa-trash-o"></i> </button></td></tr>'; 
               /*ajax call*/
            $.ajax(
                    {
                        type: 'POST',
                        url: 'scripts/ajax/index.php',
                        data: {
                            method: 'addtocart',
                            id: test_data_id,
                            name: test_data_name,
                            price: test_data_price
                        },
                        dataType: 'json',
                        success: function(data) {
                            if (data.RESULT == 0) {
                                $(thisButton).text("added to cart"); //Use again like this
                                $(".cart-number").text(data.productcount);
                                $.growl.notice({
                                    title: "Shopping Cart",
                                    message: data.MSG
                                });
                            $('#myTable tr:first-child').after(static_html);
                            } else if (data.RESULT == 2) {
                                $.growl.error({
                                    title: "Shopping Cart",
                                    message: data.MSG
                                });
                            } else {
                                $.growl.error({
                                    title: "Shopping Cart",
                                    message: data.MSG
                                });
                            }
                        }
                    }); 
            }
            else
            {
                $.growl.error({
                                    title: "Shopping Cart",
                                    message: "Already in Cart"
                                });
            }
            
    });

未捕获的TypeError：无法读取未定义的属性“createDocumentFragment”

3 个答案: