jQuery來隱藏虛擬按鍵和顯示提交按鈕

我有這個js（jQuery的）：jQuery來隱藏虛擬按鍵和顯示提交按鈕

<script type="text/javascript">  
    if ($('input.checkbox_check').is(':checked')) { 
     $('#hide-temp-submit').hide(); 
     $('#show-submit').show(); 
    } 
</script>

而這個HTML：

<input type="checkbox" class="checkbox_check" name="" value=""> 
<button class="login_button" id='hide-temp-submit' style="background-color:#101010;color:grey;">Please Agree to Terms</button> 
<button class="login_button" id='create_button show-submit' style="display:none">Create Account</button>

上隱藏的 '虛擬' 的提交按鈕任何幫助，並顯示覆選框被選中後的實際提交按鈕？

謝謝！

來源

2015-04-28 user1661677

是否臨時按鈕執行任何功能？如果沒有，爲什麼不標記你的複選框？然後，您可以選中表單提交，如果複選框被選中或者默認禁用了真實按鈕，則在複選框被選中時啓用它。 – Jack

使用類 - ......你有你的第二個按鈕ID的空間：

<script type="text/javascript">  
    if ($('input.checkbox_check').is(':checked')) { 
     $('.hide-temp-submit').hide(); 
     $('.show-submit').show(); 
    } 
</script>

HTML：

<input type="checkbox" class="checkbox_check" name="" value=""> 
<button class="login_button hide-temp-submit" style="background-color:#101010;color:grey;">Please Agree to Terms</button> 
<button class="login_button create_button show-submit" style="display:none">Create Account</button>

來源

2015-04-28 19:32:17 Ted

您的代碼大多是正確的，但是你沒有叫在特定事件上，僅在頁面加載時。

您只需將事件連接到複選框更改，如上所述，您的ID對提交按鈕無效。

$(".checkbox_check").on("change", function() { 
 
    if ($('input.checkbox_check').is(':checked')) { 
 
    $('#hide-temp-submit').hide(); 
 
    $('#show-submit').show(); 
 
    } else { 
 
    $('#hide-temp-submit').show(); 
 
    $('#show-submit').hide();  
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input type="checkbox" class="checkbox_check" name="" value=""> 
 
<button class="login_button" id='hide-temp-submit' style="background-color:#101010;color:grey;">Please Agree to Terms</button> 
 
<button class="login_button" id='show-submit' style="display:none">Create Account</button>

來源

2015-04-28 19:33:42 dave

時頁面加載，你需要一個事件處理程序來管理用戶輸入您的代碼將只運行

$(function(){  
    $('input.checkbox_check').change(function(){ 
     $('#hide-temp-submit').toggle(!this.checked); 
     $('#show-submit').toggle(this.checked); 
    }).change(); // trigger event on page load (if applicable) 
});

toggle(boolean)會隱藏/顯示

注意：在show-submit按鈕上有一個無效的空格分隔ID

DEMO

來源

2015-04-28 19:35:10 charlietfl

jQuery來隱藏虛擬按鍵和顯示提交按鈕

回答

相關問題