2017-03-28 4 views
0

私は既に同様の質問をしてきましたが、コードの断片的な修正を試してみましょう。以下のようなコードで は、どのように私の代わりに、いくつかの単一の場合よりも、一般的なケース$('.add_field_button_sub_'+x)を定義します$('.add_field_button_sub_0'), $('.add_field_button_sub_1'), ... (はい、私は知っている、私はJSがどのように機能するかについて、いくつかの基本的な理解を見逃すことは、とにかく助けてください)JQueryどのように変数を渡すのですか

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
<head> 
 

 
<title> test </title> 
 
<script src="jquery-3.2.0.js" type="text/javascript"> </script> 
 
<script type="text/javascript"> 
 
$(document).ready(function() { 
 
    var wrapper   = $(".input_fields_wrap"); 
 
    
 
    var x = 0; //initial text box count 
 
    $(".add_field_button").click(function(e){ 
 

 
\t if(x < 4){ 
 
\t $("<div><div>Hello! ("+x+")</div><div><button class=\"add_field_button_sub_"+x+"\">Sub Button "+x+"</button></div><br><a href=\"#\" class=\"remove_field\">Remove</a></div><hr>").insertBefore('.add_field_button'); 
 

 
    var y = 0; 
 
$('.add_field_button_sub_0').click(function(e){ 
 

 

 
\t $("<div><div>Hello Sub! ("+x+"-"+y+")</div><br><a href=\"#\" class=\"remove_field\">Remove</a></div><hr>").insertBefore('.add_field_button_sub_0'); 
 
\t y++; 
 
    }); 
 

 
$('.add_field_button_sub_1').click(function(e){ 
 
\t $("<div><div>Hello Sub! ("+x+"-"+y+")</div><br><a href=\"#\" class=\"remove_field\">Remove</a></div><hr>").insertBefore('.add_field_button_sub_1'); 
 
\t y++; 
 
    }); 
 

 
$('.add_field_button_sub_2').click(function(e){ 
 
\t $("<div><div>Hello Sub! ("+x+"-"+y+")</div><br><a href=\"#\" class=\"remove_field\">Remove</a></div><hr>").insertBefore('.add_field_button_sub_2'); 
 
\t y++; 
 
    }); 
 

 
x++; 
 
} 
 
    }); 
 

 
    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text 
 
     e.preventDefault(); $(this).parent('div').remove(); 
 
    }) 
 
}); </script> 
 

 

 
</head> 
 
<body> 
 
<h3>TEST</h3> </br> 
 

 
<div class="input_fields_wrap"> 
 
    <button class="add_field_button">Fonti</button> 
 
</div> 
 

 
</body> 
 
</html>

答えて

0

jQueryのattribute contains selectorを使用できます。これはadd_field_button_sub_を含むクラスを持つすべてのbutton要素にマッチします:中$(this)によって参照

$("button[class*='add_field_button_sub_']") 

それはすべてあなたのボタンに同じクラスを提供し、現在の要素に対するあなたの挿入操作を行うにはより多くの意味をなすかもしれないことに注意してください(クリックコールバックなど)。

関連する問題