根据所选下拉列表值隐藏链接

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