如何使用radio_button_tag

我有3個單選按鈕和3周的div喜歡隱藏的div：如何使用radio_button_tag

<%= radio_button_tag('radioButton','1')%> 
<%= radio_button_tag('radioButton','2')%> 
<%= radio_button_tag('radioButton','3')%> 

<div id="div1" style="display: none;">div1</div> 
<div id="div2" style="display: none;">div2</div> 
<div id="div3" style="display: none;">div3</div>

我在rails.I新希望顯示div1是首先點擊radibutton時，顯示div2點擊第二radibutton時並單擊第三個radibutton時顯示div3。

我可以很容易地在ASP.NET中做到這一點，但我怎麼能在ROR中做到這一點。我可以在不使用JavaScript或Ajax的情況下實現此目的。

來源

2014-09-19 John

這雖然尖叫爲JavaScript .. – rorofromfrance 2014-09-19 10:44:37

我不知道太多關於JavaScript的，這就是爲什麼我想要做它在Rails的，是有可能還是我必然要使用JavaScript。 – John 2014-09-19 10:50:27

任何時候你有「現場」前端互動，這意味着你需要JavaScript的一種或另一種方式 – rorofromfrance 2014-09-19 10:53:14

很簡單：

製作js文件與下面的代碼：

$(function() { 
    var checkbox = document.getElementById('radioButton'); 
    var delivery_div = document.getElementById('div1'); 
    var showHiddenDiv = function(){ 
     if(checkbox.checked) { 
      delivery_div.style['display'] = 'block'; 
     } else { 
      delivery_div.style['display'] = 'none'; 
     } 
    } 
    checkbox.onclick = showHiddenDiv; 
    showHiddenDiv(); 
});

來源

2014-09-19 10:48:34

如果你想隱藏其他的div被點擊一個收音機時，你可以試試這個：

您的視圖模板不改變任何東西：

<%= radio_button_tag('radioButton','1') %> 
<%= radio_button_tag('radioButton','2') %> 
<%= radio_button_tag('radioButton','3') %> 

<div id="div1" style="display: none;">div1</div> 
<div id="div2" style="display: none;">div2</div> 
<div id="div3" style="display: none;">div3</div>

在你的JavaScript文件中，讓我們說application.js（請注意，如果你在一個包括所有的單選按鈕纔會有這種行爲。你可以使用一個類，並結合該類只）

$(function() { 
    $(document).on("click","input[type=radio]", function() { 
    var id = "#div"+$(this).val(); 
    $(id).show(); // display associated div 
    $("div[id^='div']:not(" + id + ")").hide() // hide the others 
    }) 
});

來源

2014-09-19 11:59:58 Fer

在你的情況我不知道的一種方式只是在軌道上做。就像通常在JS或JQuery中完成的一樣。你可以看看下面的這個鏈接是你正在尋找一個簡單的教程顯示/隱藏div與單選按鈕。

http://community.sitepoint.com/t/very-basic-show-hide-div-with-radio-button/4932

來源

2014-09-19 17:14:15 Awhitey98

如何使用radio_button_tag

回答

相關問題