根據所選下拉列表值隱藏鏈接

Question

我需要編寫一些jquery，它將讀取下拉列表中的當前值，然後隱藏頁面上的特定鏈接。

下拉列表是一個區域設置選擇器。所以當我選擇「英語」時，我希望隱藏鏈接，但選擇法語時，鏈接必須保留。

你能告訴我如何做到這一點嗎？我想學習這一點。由於

Answer 1

如何：

function handleLang() { 
    if ($('#select').val() == 'en') { 
     $('#link').hide(); 
    } else { 
     $('#link').show(); 
    } 
} 
$(function() { 
    // hide/show on load 
    handleLang(); 

    // hide/show when the language is changed (useful if the page doesn't reload) 
    $('#select').change(handleLang); 
}); 

Answer 2

基礎上提供了通過註釋中的第一個答案的作者提供了這個問題，更多的提示第一個答案，這裏是最後的（和緊湊）完整版的代碼爲我工作（我也刪除和樣式因爲不再需要）。這是此測試應用程序的index.html.erb中提供的主頁面。

<h2 id='main_header'>Showing/hiding link based on dropdown selection</h2> 

<table> 
    <thead> 
    <th>Action</th> 
    <th>Skip assessment</th> 
    <th>Reason for skipping</th> 
    </thead> 
    <tbody> 
    <tr> 
     <td> 
     <%= link_to 'Start asseement', url_for(controller: :home, action: :start_assessment), id: 'start_assessment' %> 
     </td> 
     <td> 
     <%= select_tag "skip_option", options_for_select([ "Yes", "No" ], "No"), id: "skip_option", onchange: "reason_picker()" %> 
     </td> 
     <td> 
     <%= text_field_tag "reason_for_skipping", nil, size: 50, placeholder: 'Enter reason here...' %> 
     </td> 
    </tr> 
    </tbody> 
</table> 

<script type="text/javascript"> 
    $(document).ready (
    window.reason_picker = function() { 
     var selected = document.getElementById("skip_option").selectedIndex; 
     if (selected == 0) { 
     $("#reason_for_skipping").show(); 
     $("#start_assessment").hide(); 
     } 
     else { 
     $("#reason_for_skipping").hide(); 
     $("#start_assessment").show(); 
     } 
    } 
); 
</script> 

開始評估頁面是非常基本的，只是一個標題和返回鏈接到包含在start_assessment.html.erb文件主頁：

<h1>Assessment</h1> 

<%= link_to 'Back', :back %> 

我這是任何幫助，在這裏是控制器home_controller.rb文件：

class HomeController < ApplicationController 
    def index 
    end 

    def start_assessment 
    end 
end 

和路由route.rb文件是：

Rails.application.routes.draw do 
    root controller: 'home', action: :index 
    get 'start_assessment' => 'home#start_assessment' 
end