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;
});

追加する要素は、ブートストラップ スタイルのボタンです。しかし、追加が完了した後

<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>

これは、"product_add_name" のdata-product-id="'代わりにdata-product-id='" " を使用しなくても問題'" class=...なく動作します' class...(ただし、product_add_name にスペースがある場合は、期待される出力を得るために "" を使用する必要があります)。

ログインして、何"product_add_name"があるかを確認してください。"product_add_name"これは、によって返される which に"$this.data('item-name')"互換性のない文字がある場合に発生する可能性があります。

あなた"product_add_name"も有効な場合は、この子要素を追加しているかどうかを確認してください

スタイルが適用された有効な親にdisplay:block。

于 2013-09-04T07:17:26.247 に答える