Jquery 바인드 이벤트가 응답하지 않습니다.

Question

기본적으로 단추를 누를 때마다 투표 수를 늘리거나 줄이려고합니다 (제 오류를 악용하기 위해 상황을 어리석게했습니다). 클릭 이벤트가있는 두 개의 다른 버튼을 바인딩하지만, (Firebug로 테스트 한) 응답을받지 못했습니다.

JQuery와 코드 : 클래스 buttonUp 또는의 buttonDown와

가

//This Code is located within Application.js (Rails) 
$(document).ready(function() { 
    $('.buttonUp').bind('click', function() { 
     var voting_element = $(this).closest('.current_vote'); 
     voting_element.text(Number(voting_element.text()) + 1); 
    }); 
    $('.buttonDown').bind('click', function() { 
     var voting_element = $(this).closest('.current_vote'); 
     voting_element.text(Number(voting_element.text()) - 1); 
    }); 
}); 

각 버튼은 하나의 전송 버튼을 포함하는 형태에 위치해 있습니다.

나는 레일 3.1.3에서이 일을하고, JQuery와 라이브러리의 다음 버전을 사용하고 있습니다 :

JQuery와 레일 => 1.0.12
jQuery를 => 1.6.1
JqueryUI => 1.8. 12
JqueryUJS => 위의 Jquery-Rails와 함께 제공되는 것.

라이브도 작동하지 않습니다. 버튼에 메서드를 바인딩하기 전에 문서가로드 될 때까지 기다릴 것이므로 예상하지 못했습니다.

다음은 해당 HTML 스 니펫입니다.

<tr> 
    <td>pop</td> 
    <td>pop</td> 
    <td><a href="/posts/12">Show</a></td> 
    <td><a href="/posts/12/edit">Edit</a></td> 
    <td><a href="/posts/12" data-confirm="Are you sure?" data-method="delete" rel="nofollow">Destroy</a></td> 
    <td><p> 
     <b>votes: </b> 
    </p> 
     <p class="current_vote"> 
     1 
     </p> 
     <form action="/posts/increaseVote?id=12" class="button_to" data-remote="true" data-type="json" method="post"><div><input class="buttonUp" type="submit" value="increaseVote" /><input name="authenticity_token" type="hidden" value="TxEGwONzSD+tnJ19iHMdGjuCBJMFoNJdECEspDtZxxY=" /></div></form> 
     <form action="/posts/decreaseVote?id=12" class="button_to" data-remote="true" data-type="json" method="post"><div><input class="buttonDown" type="submit" value="decreaseVote" /><input name="authenticity_token" type="hidden" value="TxEGwONzSD+tnJ19iHMdGjuCBJMFoNJdECEspDtZxxY=" /></div></form> 
    </tr> 

Answer 1

오른쪽 방향을 가리 키려면이 DEMO을보십시오.

$(document).ready(function() { 

    function vote(el, amt) { 
     var $counter = $(el).siblings('.counter'); 
     $counter.text(parseInt($counter.text(), 10) + amt); 
    } 

    $('.voteUp').bind('click', function() { 
     vote(this, 1); 
    }); 

    $('.voteDown').bind('click', function() { 
     vote(this, -1); 
    }); 

});​