【问题标题】:First option in dropdown disables submit button on form下拉列表中的第一个选项禁用表单上的提交按钮
【发布时间】:2013-08-18 03:06:27
【问题描述】:

我的网站上有一个连接到 Mailchimp 的表单。除了从下拉菜单中选择顶部选项(当前为“全部”)之外,这一切似乎都完美无缺。

这是表单的代码:

    <?php if(is_front_page()) { ?>

<style>
.fixed_header.social_header #main{padding-top: 0px!important;}
.mailchimp{ width: 100%;background: url(<?php bloginfo('template_url') ?>/images/bg_mc.png) no-repeat; background-position: left top; background-size: 100% 100% ; min-height: 399px; padding: 154px 0 20px 0;}
.inner-mailchimp{margin: 0 auto; width: 805px; text-align: center;}
.mailchimp h1, .mailchimp h3{color: #fff;} 
/*#news_mc, #everything, #business_mc, #technology_mc, #dnd_mc, #smedia_mc{display: none;}*/
#mc_embed_signup{background: none!important;}
#everything_mc{ display: block;}
.form_mc{width: 400px; float: left;}
#mc_embed_signup .mc-field-group select{ padding: 7px 0!important;}
#dnd_mc, #news_mc, #business_mc, #technology_mc, #smedia_mc{display:none;}
.mc-field-group label{color: #fff;}
#mc-embedded-subscribe-form .clear{visibility: visible; overflow: visible; right: -271px;  top: -13px; background: url(<?php bloginfo('template_url');?>/images/c.png ); position: relative;}
#mc_embed_signup .button{ background-color: #005CBF!important; font-weight: normal!important;}

</style>
<script>

function fill_email(my_mail){
    var fillupemail = document.getElementById(my_mail).value;
    //alert(fillupemail);
    document.getElementById('unique_news').value = fillupemail;
    document.getElementById('unique_business').value = fillupemail;
    document.getElementById('unique_dnd').value = fillupemail;
    document.getElementById('unique_everything').value = fillupemail;
    document.getElementById('unique_smedia').value = fillupemail;
    document.getElementById('unique_technology').value = fillupemail;

}

function mailchange(id){
    var x = document.getElementById(id);

    if(x.value == 'everything'){
        document.getElementById('dnd_mc').style.display='none';
        document.getElementById('news_mc').style.display='none';
        document.getElementById('business_mc').style.display='none';
        document.getElementById('technology_mc').style.display='none';
        document.getElementById('smedia_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }
    if(x.value == 'news'){
        document.getElementById('everything_mc').style.display='none';
        document.getElementById('dnd_mc').style.display='none';
        document.getElementById('business_mc').style.display='none';
        document.getElementById('technology_mc').style.display='none';
        document.getElementById('smedia_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }
    if(x.value == 'business'){
        document.getElementById('everything_mc').style.display='none';
        document.getElementById('dnd_mc').style.display='none';
        document.getElementById('news_mc').style.display='none';
        document.getElementById('technology_mc').style.display='none';
        document.getElementById('smedia_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }
    if(x.value == 'technology'){
        document.getElementById('everything_mc').style.display='none';
        document.getElementById('dnd_mc').style.display='none';
        document.getElementById('news_mc').style.display='none';
        document.getElementById('business_mc').style.display='none';
        document.getElementById('smedia_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }
    if(x.value == 'dnd'){
        document.getElementById('everything_mc').style.display='none';
        document.getElementById('news_mc').style.display='none';
        document.getElementById('business_mc').style.display='none';
        document.getElementById('technology_mc').style.display='none';
        document.getElementById('smedia_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }
    if(x.value == 'smedia'){
        document.getElementById('everything_mc').style.display='none';
        document.getElementById('dnd_mc').style.display='none';
        document.getElementById('news_mc').style.display='none';
        document.getElementById('business_mc').style.display='none';
        document.getElementById('technology_mc').style.display='none';

        document.getElementById(x.value+'_mc').style.display='block';
    }

}
</script>

<div class="mailchimp">
    <div class="inner-mailchimp">
        <h1>Scientia potentia est</h1>
        <h3>Knowledge is Power</h3>
        <div class="form_mc">
            <?php include('mailchimp-everything.php'); ?>
            <?php include('mailchimp-news.php'); ?>
            <?php include('mailchimp-business.php'); ?>
            <?php include('mailchimp-technology.php'); ?>
            <?php include('mailchimp-dnd.php'); ?>
            <?php include('mailchimp-smedia.php'); ?>
        </div><!-- form -->
        <div class="form_mc">

            <div class="everything_mc display_mc" id="mc_embed_signup"><form>
            <div class="mc-field-group selectmail_mc">
                <label for="mce-EMAIL">Interest </label>
                <select onchange="mailchange(this.id)" id="selectmail_c">
                    <option value="everything">All</option>
                    <option value="news">News</option>
                    <option value="business">Business</option>
                    <option value="technology">Technology</option>
                    <option value="dnd">Design & Development</option>
                    <option value="smedia">Social Media</option>
                </select>
            </div></form>
            </div>

        </div><!-- form -->
        <small style="color: #FFFFFF; float: left; font-size: 13px; margin-bottom: 20px; text-align: center; width: 100%;">Don't worry there's no spam just intriguing posts and <u>free</u> resources.</small>
    </div>
</div>
 <?php } ?>

我也检查了下拉菜单中每个选择的单独文件,但它们似乎都是正确的,所以我相信问题一定出在这段代码中。不幸的是,我无法理解它来破译问题可能是什么。

编辑:This is the site,它是标题下方的表单。

任何帮助都非常感谢,谢谢!

【问题讨论】:

  • 还有其他关于 Stack world 的想法吗?

标签: php javascript wordpress forms mailchimp


【解决方案1】:

如果您从下拉列表中选择不同的选项,然后返回到第一个下拉选项,它会起作用吗? (不幸的是,由于我的代表率低,我无法发布 cmets)我觉得问题可能是页面加载时未调用您的 mailchange 函数,因此您必须实际“选择”所有选项,而不是默认为它。

【讨论】:

  • 您好,感谢您的回复。我只是尝试选择另一个,然后恢复为“全部”选项,但它仍然不起作用。
  • 我很困惑为什么显然有一个“一切”元素,而不是只显示所有元素。不幸的是,我从未使用过 mailchimp 或 php,但为什么不尝试将显示设置为在 x.value == 'everything' 块中的所有元素上可见?
  • 不确定您的意思。像这样? if(x.value == 'everything'){ document.getElementById('dnd_mc').style.display='visible'; document.getElementById('news_mc').style.display='visible'; document.getElementById('business_mc').style.display='visible'; document.getElementById('technology_mc').style.display='visible'; document.getElementById('smedia_mc').style.display='visible'; document.getElementById(x.value+'_mc').style.display='block'; } 如果是这样,那似乎没有任何改变。
  • 好的。感谢您的链接,我看了一会儿,我很确定我之前提到的东西与问题无关。我唯一能找到的另一件事(恐怕这太让我头疼了)是在 news_mc
    中有 &lt;input type="email" value="" name="EMAIL" class="required email unique_news" onchange="fill_email(this.id)" id="unique_news" /&gt; 而在 Everything_mc
    中有 &lt;input type="email" value="" name="EMAIL" class="required email" onchange="fill_email(this.id)" id="unique_everything"&gt; 也许你需要一个“unique_everything " 添加到班级?
猜你喜欢
  • 2014-08-07
  • 2018-08-25
  • 1970-01-01
  • 1970-01-01
  • 2011-07-23
  • 2015-01-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多