0

我有一个 jquery 脚本

$('.add-item').on('click',function(){
    var URL = '{% url "main:adding_from_all_products" %}';
    var $this = $(this);
    var product_add_name = $this.data('item-name');
    $.post(URL,{'product_add_name':product_add_name},function(response){
        $(".test").append('<p class="product-item">'+
                            '<span class="product-width-fix">' +
                            response +
                            '<a href="#" data-product-id=' + product_add_name +
                            'class="btn btn-mini btn-success remove-product">Remove</a></span></p>');
    })
    return true;
});

我添加的元素是一个带有 bootstrap 样式的按钮。但是在追加完成后

<a href="#" data-product-id=' + product_add_name +
                                    'class="btn btn-mini btn-success remove-product">Remove</a></span></p>

该按钮没有出现，它只是一个没有任何样式的链接。我应该怎么办 ？

4

3 回答 3

2

也许你""需要product_add_name： 

$(".test").append('<p class="product-item">'+
                                    '<span class="product-width-fix">' +
                                             response +
                                    '<a href="#" data-product-id="' + product_add_name +
                                    '" class="btn btn-mini btn-success remove-product">Remove</a></span></p>');
于 2013-09-04T06:46:10.027 回答
0

尝试

$(".test").append('<p class="product-item">' +
                  '<span class="product-width-fix">' + response +
                  '<a href="#" data-product-id=' + product_add_name +
                  ' class="btn btn-mini btn-success remove-product">Remove</a></span></p>');

product_add_name和之间没有空格class

于 2013-09-04T06:34:16.350 回答
0

我刚刚用代码检查了这个，

<html>
<head>
<script src="http://code.jquery.com/jquery-git2.js"></script>
<script>
  $(function(){
  var response="The Product Name";
  var product_add_name="productName";

  $(".test").append('<p class="product-item">'+
        '<span class="product-width-fix">' +response +
        '<a href="#" data-product-id=' + product_add_name +
    ' class="btn btn-mini btn-success remove-product"> Remove </a></span></p>');
  });
</script>
</head>
<body><div class="test"></div></body>
</html>

即使您没有使用“”data-product-id="'代替“product_add_name”，data-product-id='也可以正常'" class=...工作' class...（但如果您在 product_add_name 中有空格，则需要使用“”才能获得预期的输出）。

请登录并查看是什么"product_add_name"。如果您"product_add_name"返回的"$this.data('item-name')"内容具有任何不兼容的字符，则可能会发生这种情况。

如果您"product_add_name"的也是有效的，只需检查您是否正在添加此子元素

应用样式的有效父display:block级。

于 2013-09-04T07:17:26.247 回答