IT박스

link_to 메소드 및 Rails의 클릭 이벤트

itboxs 2020. 10. 28. 07:54
반응형

link_to 메소드 및 Rails의 클릭 이벤트


이 유형의 링크는 어떻게 만듭니 까?

<a href="#" onclick="document.getElementById('search').value=this.value">

link_toRails에서 방법 사용 합니까?

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

반응형