입력 내용에 #

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.each 내에서 그것을 반복 항상

Answer 3

focusout을 사용하여 똑같은 항목을 액세스하는 $ (this)를 사용하는 것이 좋습니다.

$("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>