如何禁用下拉菜单中的第一个选项？

Question

我在网站“我希望赞助”的右侧选择菜单选项。 默认的下拉菜单设置为“选择”选项，我希望有人按下go按钮时页面不会走到任何地方。 当前，当用户按下不带选择选项的“运行”按钮时，它将转到“ 404”页面。 如何在不选择下拉菜单中两个给定选项的情况下停止页面移动？

屏幕快照还附有链接，链接为： http : //ilmoamal.org/newsite2017/sponsor-now-testing/

在此处输入图片说明

Answer 1

在function.php文件中添加以下代码以删除选择选项

<?php
function myscript() {
?>
<script type="text/javascript">
$(document).ready(function()
{
   $("#link").children().first().remove();           
});
</script>
<?php
}
add_action( 'wp_footer', 'myscript' );
?>

Answer 2

我已经看到您使用联系表7选择框。 还可以看到您在选择框中为第二个和第三个选项设置了值，但是在第一个选项中没有该选项的值。 最好的方法是将值＃设置为要禁用的第一个选项 。 然后让我知道结果。 我的意思是

<option value="#">Select</option>

Answer 3

您可以在WordPress主题的footer.php文件中使用它。 如果未选择任何选项，则将禁用“开始”按钮。

<script>
jQuery( document ).ready(function() {
jQuery(".wpcf7-form .submit input").prop('disabled', true);
jQuery(".wpcf7-form select option:first").prop('disabled', true);

jQuery("#link").change(function(){
var conceptName = jQuery('#link').find(":selected").text();

if(conceptName == "select"){
} else {
    jQuery(".wpcf7-form .submit input").prop('disabled', false);
}
});
});
</script>

 jQuery( document ).ready(function() { jQuery(".wpcf7-form .submit input").prop('disabled', true); jQuery(".wpcf7-form select option:first").prop('disabled', true); jQuery(".wpcf7-form select option:first").prop('selected', true); jQuery("#link").change(function(){ var conceptName = jQuery('#link').find(":selected").text(); if(conceptName == "select"){ } else { jQuery(".wpcf7-form .submit input").prop('disabled', false); } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <form class="wpcf7-form"> <h4>I wish to sponsor</h4> <p><select id="link"><option>Select</option><option value="http://ilmoamal.org/bms/apps_available.php?start=1&amp;link=72f061b63526b44879240efb612646ed&amp;project_id=1&amp;submit=+Go+">A Child's Education</option><option value="http://ilmoamal.org/bms/apps_available.php?start=1&amp;link=72f061b63526b44879240efb612646ed&amp;project_id=3&amp;submit=+Go+">A Family Help</option></select></p> <div class="submit"> <input onclick="go()" name="submit" value="Go" type="button" id="submit"> </div> </div> </form> 

您可以点击上方的“ Show Code Snippet ”链接以运行并测试该代码。

Answer 4

只需将其添加到您的脚本中-

jQuery(document).ready(function(){
  jQuery('#sidebar #link > option:first-child').attr('disabled', 'disabled');
});

Answer 5

Using CSS you can remove!

<style>

 #link:focus option:first-of-type {
        display: none;
    }
</style>