반응형
link_to 메소드 및 Rails의 클릭 이벤트
이 유형의 링크는 어떻게 만듭니 까?
<a href="#" onclick="document.getElementById('search').value=this.value">
link_to
Rails에서 방법 을 사용 합니까?
Rails 문서 에서 알아낼 수 없었습니다 .
다음을 사용할 수 있습니다 link_to_function
(Rails 4.1에서 제거됨).
link_to_function 'My link with obtrusive JavaScript', 'alert("Oh no!")'
또는 절대적으로 사용해야하는 경우 link_to
:
link_to 'Another link with obtrusive JavaScript', '#',
:onclick => 'alert("Please no!")'
그러나 바로 생성 된 HTML에 자바 스크립트를 넣는 것은 돌출 되고 나쁜 관행 .
대신 Rails 코드는 다음과 같아야합니다.
link_to 'Link with unobtrusive JavaScript',
'/actual/url/in/case/javascript/is/broken',
:id => 'my-link'
Prototype JS 프레임 워크를 사용한다고 가정하면 JS는 다음과 같습니다 application.js
.
$('my-link').observe('click', function (event) {
alert('Hooray!');
event.stop(); // Prevent link from following through to its given href
});
또는 jQuery를 사용하는 경우 :
$('#my-link').click(function (event) {
alert('Hooray!');
event.preventDefault(); // Prevent link from following its href
});
이 세 번째 기술을 사용하면 사용자가 JavaScript를 사용할 수없는 경우 링크가 조용히 실패하는 것이 아니라 다른 페이지로 연결되도록 보장합니다. 사용자의 인터넷 연결 상태가 좋지 않거나 (예 : 모바일 장치, 공용 Wi-Fi), 사용자 또는 사용자의 시스템 관리자가이를 비활성화했거나 예기치 않은 JS 오류 (예 : 개발자 오류)가 발생하여 JS를 사용할 수 없습니다.
JQuery를 사용하고이를 application.js 또는 head 섹션에 넣는 경우 Ron의 답변을 따르려면 ready () 섹션으로 래핑해야합니다.
$(document).ready(function() {
$('#my-link').click(function(event){
alert('Hooray!');
event.preventDefault(); // Prevent link from following its href
});
});
그냥 사용
=link_to "link", "javascript:function()"
또 다른 솔루션은 onClick 이벤트를 포착하고 js 함수에 대한 집계 데이터의 경우
.hmtl.erb
<%= link_to "Action", 'javascript:;', class: 'my-class', data: { 'array' => %w(foo bar) } %>
.js
// handle my-class click
$('a.my-class').on('click', function () {
var link = $(this);
var array = link.data('array');
});
참고 URL : https://stackoverflow.com/questions/698858/link-to-method-and-click-event-in-rails
반응형
'IT박스' 카테고리의 다른 글
PHP를 사용하여 디렉토리가 비어 있는지 어떻게 확인할 수 있습니까? (0) | 2020.10.28 |
---|---|
Visual Studio는 잘 컴파일되지만 여전히 빨간색 선이 표시됩니다. (0) | 2020.10.28 |
jQuery 클릭 / 두 기능 간 전환 (0) | 2020.10.28 |
배열에서 모든 고유 요소를 가져 오는 jQuery 함수? (0) | 2020.10.28 |
IgnoreCase를 사용하여 C # Switch 문을 만드는 방법 (0) | 2020.10.28 |