2014-10-28 4 views
1

제목이 실제로 내 문제를 설명하지 않으면 미리 사과드립니다. 나는 아직도 javascript/jquery에 익숙하지 않다. 그리고 이것은 내가 문제를 이해하는 방법이다 ...

나는 나의 웹 페이지에 요소를 추가하는 함수를 호출하는 버튼을 사용하고있다.

<button id="bartspbyu" class="btn btn-xs btn-success add-alert" onClick="this.disabled = 'disabled';">Add</button> 

클릭하면 볼 수있는 것처럼 자체가 비활성화됩니다. 또한 스크립트를 사용하여 텍스트를 "추가"에서 "추가됨"으로 변경합니다.

$('.add-alert').on('click', function() { 
    $('#added-alert').fadeIn('slow'); 
    setTimeout(function() { 
    $('#added-alert').fadeOut('slow'); 
    }, 2000); 
    $(this).text('Added'); 
}); 

사용자는 추가 한 요소를 삭제할 수 있습니다. 그들이 요소를 삭제하면 단추가 다음 스크립트를 사용하여 다시 활성화됩니다 :

//Reactive Add Button 
    $(document).on("click", ".drartspbyu", function(){ 
    $("#bartspbyu").removeAttr("disabled"); 
}); 

이 잘 작동하지만 나는 그것이 다시 "추가"로 버튼의 텍스트를 변경하려고 노력하고있다. 나는 다음과 같이했다 :

//Reactive Add Button 
$(document).on("click", ".drartspbyu", function(){ 
    $("#bartspbyu").removeAttr("disabled", function(){ 
     $(this).text('Add'); 
    }); 
}); 

그것은 버튼을 다시 가능하게하지만 텍스트를 편집하는 것이 아니다. $(this)을 잘못 설정했는지 또는 전체가 잘못되었는지 잘 모르겠습니다.

내가 $("#bartspbyu").text('Add');과 같은 것을 할 수 있다는 것을 알았지 만, $(this)을 사용하는 이유는 이러한 추가 버튼이 수백 개이기 때문에 각 개별 ID를 편집하는 데 시간을 낭비하고 싶지 않기 때문입니다 (#bartspbyu는 400 개 중 하나). 언급 된 첫 번째 인스턴스에서 #bartspbyu를 읽는 방법을 찾을 수 있다면 Find + Replace를 수행하고이 여분의 코드 행을 모든 항목에 추가하기 만하면 몇 시간의 작업을 절약 할 수 있습니다.

미리 도움을 청하십시오! 다시 한 번 말하지만, 저는 아직 새로운 것을 알고 있습니다. 그래서 나는 분명히 아주 명백한 것이 빠져 있다는 것을 알고 있습니다.

+1

두 가지. 하나 -'removeAttr'는 콜백이 없습니다 (http://api.jquery.com/removeattr/). 그냥 다음 줄에서'.text()'를 호출하거나 호출을 연결하십시오. 둘째,'.prop()'를 사용하여 비활성 상태를 변경하십시오. – Ian

답변

4

removeAttr()에는 콜백 기능 (http://api.jquery.com/removeAttr/)이 없습니다. 같은 요소에 적용하기 때문에 text()에 추가해야합니다.

$("#bartspbyu").removeAttr("disabled").text("Add"); 

jQuery를 사용하면 '메소드 체인'기능을 사용할 수 있습니다. $("") 생성자는 속성을 제거한 다음 텍스트를 변경하는 등 여러 가지를 적용 할 수있는 객체를 생성합니다. 입력 한 것처럼 작동합니다 :

$("#bartspbyu").removeAttr("disabled") 
$("#bartspbyu").text("Add") 

이점은 실제로 반복 할 필요가 없다는 것입니다. 또한 removeAttr()에는 콜백 함수가 없으므로 (매개 변수로 속성의 이름 만 사용함) 의도하지 않은 전달 된 익명 함수를 실행하지 않습니다.

+0

와우, 너무 쉽습니다! 정말 고맙습니다. 효과가 있습니다.:) – SAULMARQ

+0

나는 그것을 단지 "연결"이라고 알고있다. 실제로 그것이 실제로 어디에서 왔는지 결코 생각하지 못했다. [http://en.wikipedia.org/wiki/Daisy_chain_ (electrical_engineering)]). 고마워요 @ something something – Lix

+1

@Lix : 오히려 이것입니다 : http://en.wikipedia.org/wiki/Method_chaining –

3

removeAttr의 두 번째 인수가 콜백이라고 생각하지 않습니다. 대신에, 단지

$("#bartspbyu").removeAttr("disabled").text('Add'); 
1

나는 또한 그냥 당신이 JQuery와의 첫 번째 블록에 해제 코드를 추가하는 자바 스크립트 인라인 치우는 제안 체인을 활용.

+0

정말 질문이 아니지만 더 나은 연습이고 그는 이미'.click()'을 구현했기 때문에 (: – somethinghere

+0

) 나는 바보가 될 것입니다. – SAULMARQ

관련 문제