Development Tip

jQuery : 버튼을 제외한 첫 번째 보이는 입력 / 선택 / 텍스트 영역을 찾는 방법은 무엇입니까?

yourdevel 2020. 10. 4. 13:33
반응형

jQuery : 버튼을 제외한 첫 번째 보이는 입력 / 선택 / 텍스트 영역을 찾는 방법은 무엇입니까?


나는 시도했다

$(":input:not(input[type=button],input[type=submit],button):visible:first")

하지만 아무것도 찾지 못합니다.

내 실수는 무엇입니까?

UPD : $ (document) .load ()에서 실행합니다.

<script type="text/javascript">
$(window).load(function () {
  var aspForm  = $("form#aspnetForm");
  var firstInput = $(":input:not(input[type=button],input[type=submit],button):visible:first", aspForm);
  firstInput.focus();
});
</script>

디버그에서 firstInput이 비어 있음을 알 수 있습니다.

UPD2 : Sharepoint에서 실행되는 ASP.NET 페이지에 있습니다.

지금까지 일부 요소의 경우 (고정 된 요소의 경우) 찾고 일부 요소는 찾지 못하는 것으로 나타났습니다. :(


원하는 대상 ( 데모 ) 만 타겟팅하지 않는 이유는 무엇 입니까?

$('form').find('input[type=text],textarea,select').filter(':visible:first');

편집하다

또는 jQuery : input 선택기를 사용 하여 양식 하위 항목을 필터링하십시오.

$('form').find('*').filter(':input:visible:first');

JQuery 코드는 괜찮습니다. 창로드 이벤트가 아닌 준비 처리기에서 실행해야합니다.

<script type="text/javascript">
$(function(){
  var aspForm  = $("form#aspnetForm");
  var firstInput = $(":input:not(input[type=button],input[type=submit],button):visible:first", aspForm);
  firstInput.focus();
});
</script>

최신 정보

Karim79 (예제 주셔서 감사합니다)의 예를 사용해 보았지만 잘 작동합니다 : http://jsfiddle.net/2sMfU/


이것은 위의 요약이며 나를 위해 완벽하게 작동합니다. 정보에 대해서 감사드립니다!

<script language='javascript' type='text/javascript'>
    $(document).ready(function () {
        var firstInput = $('form').find('input[type=text],input[type=password],input[type=radio],input[type=checkbox],textarea,select').filter(':visible:first');
        if (firstInput != null) {
            firstInput.focus();
        }
    });
</script>

jQuery 1.5.2 에서 지정된 속성 이없는 요소를 :text선택 하기 때문에 @Mottie의 답변보다 개선되었습니다 (이 경우 암시 됨).inputtypetype="text"

$('form').find(':text,textarea,select').filter(':visible:first')

여기 내 해결책이 있습니다. 코드는 쉽게 따라 할 수 있지만 여기에 아이디어가 있습니다.

  • 모든 입력, 선택 및 텍스트 영역 가져 오기
  • 모든 버튼 및 숨겨진 필드 필터링
  • 활성화되고 보이는 필드로만 필터링
  • 첫 번째를 선택
  • 선택한 필드에 집중

코드:

function focusFirst(parent) {
    $(parent).find('input, textarea, select')
        .not('input[type=hidden],input[type=button],input[type=submit],input[type=reset],input[type=image],button')
        .filter(':enabled:visible:first')
        .focus();
}

그런 다음 부모 요소 또는 선택기로 focusFirst를 호출하면됩니다.

선택자:

focusFirst('form#aspnetForm');

요소:

var el = $('form#aspnetForm');
focusFirst(el);

아래 코드를 시도해 볼 수 있습니다 ...

$(document).ready(function(){
    $('form').find('input[type=text],textarea,select').filter(':visible:first').focus();
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<form>
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
    
<input type="submit" />
</form>

참고 URL : https://stackoverflow.com/questions/2823471/jquery-how-to-find-first-visible-input-select-textarea-except-buttons

반응형