入力に＃

Question

が含まれているかどうかチェックしてください。私のフォームには、同じclass（nested_formsの私のアプリケーションで作成したもの）の10-15 inputがあります。

<h1 id="error"></h1> 
<form> 

<input class="maps_input" type="text" name="map[maps_attributes][1489492164895][link]" id="maps_attributes_1489492164895_link"> 

<input class="maps_input" type="text" name="map[maps_attributes][7192817201001][link]" id="maps_attributes_7192817201001_link"> 

<input class="maps_input" type="text" name="map[maps_attributes][1701829110864][link]" id="maps_attributes_1701829110864_link"> 

<input class="maps_input" type="text" name="map[maps_attributes][9918271627198][link]" id="maps_attributes_9918271627198_link"> 

// & more 

</form> 

ユーザーのリンクのいずれかが＃が含まれているかどうかを確認しようとしているこれらのinputs &イムにリンクを貼り付けます：私のフォームは

。

I used this solutionしかし、問題は、最初のinputのみをチェックし、残りの部分はチェックしないことです。

これは私がしようとしたものです：それは間違っているイム何ですか

// 1 
$("input.maps_input").change(function() { 
    $("input.maps_input").each(function(){ 
    if ($('input.maps_input').val().indexOf('#') > -1) { 
     $('#error').text('Has #'); 
    } 
    }); 
}); 

&

//2 
$("input.maps_input").each(function(){ 
    $("input.maps_input").change(function() { 
    if ($('input.maps_input').val().indexOf('#') > -1) { 
     $('#error').text('Has #'); 
    } 
    }); 
}); 

？

Answer 1

私が正しく、これはあなたの問題を解決することがあり

$('body').on('change', "input.maps_input", function() { 
 
    if ($(this).val().indexOf('#') > -1) { 
 
    $('#error').text('Has #'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1 id="error"></h1> 
 
<form> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][1489492164895][link]" id="maps_attributes_1489492164895_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][7192817201001][link]" id="maps_attributes_7192817201001_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][1701829110864][link]" id="maps_attributes_1701829110864_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][9918271627198][link]" id="maps_attributes_9918271627198_link"> // & more 
 
</form>

Answer 2

サミュエル・コードが動作しますあなたの問題を理解していれば、私は

、あなたは間違っていたかを理解するように説明する理由を追加したいと思います

あなたのループ内には $（ 'input.maps_input'）。val（）を使用して値にアクセスしようとしています。複数のオブジェクトがあり、最初のものだけが使用されているのでdは毎回ですので、jqueryの内部では、$（this）を使用して、繰り返している同じ項目にアクセスする方が常に良いです。

Answer 3

focusoutを使用してください。

$("input.maps_input").focusout(function() { 
 
    if ($(this).val().indexOf('#') > -1) { 
 
     $('#error').text('Has #'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1 id="error"></h1> 
 
<form> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][1489492164895][link]" id="maps_attributes_1489492164895_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][7192817201001][link]" id="maps_attributes_7192817201001_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][1701829110864][link]" id="maps_attributes_1701829110864_link"> 
 
    <input class="maps_input" type="text" name="map[maps_attributes][9918271627198][link]" id="maps_attributes_9918271627198_link"> // & more 
 
</form>