我希望在显示弹出窗口后保留一个电子邮件值。
用户将在输入中添加他的电子邮件地址,然后单击"订阅"。但是我不想在那里使用MailChimp,我想先打开一个弹出其他字段(如电话号码),但我想让用户在上一步中输入电子邮件并在那里使用MailChimp。我该怎么做?
<div class="well">
<form action="#">
<div class="row email">
<input class="btn btn-lg required_email" name="email" id="email" type="email" placeholder="MY EMAIL TO GET FIRST MY LIFE-TIME PREMIUM ACCESS">
</div>
<div class="row okbutton">
<button class="btn btn-info button" data-toggle="modal" data-target="#enquirypopup" type="submit">Subscribe</button>
</div>
</form>
</div>
<div id="enquirypopup" class="modal fade in" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content row">
<div class="modal-header custom-modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Enquire Now</h4>
</div>
<div class="modal-body">
<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="//FellowsNow.us11.list-manage.com/subscribe/post?u=fa1e6ec5c7d8f4d1f04c123e1&id=c761d217cf" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2>Subscribe to our mailing list</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
<label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
</label>
<input type="email" value=" <?php echo $_POST['EMAIL'];?>" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
<label for="mce-FNAME">First Name </label>
<input type="text" value="" name="FNAME" class="" id="mce-FNAME">
</div>
<div class="mc-field-group">
<label for="mce-LNAME">Last Name </label>
<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</div>
<div class="mc-field-group size1of2">
<label for="mce-MMERGE3">Phone Number </label>
<input type="text" name="MMERGE3" class="" value="" id="mce-MMERGE3">
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_fa1e6ec5c7d8f4d1f04c123e1_c761d217cf" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='MMERGE3';ftypes[3]='phone';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
</div>
</div>
</div>
</div>
&#13;
答案 0 :(得分:0)
尝试使用js onclick函数进行首次订阅按钮。并使用js或jquery获取输入的电子邮件值。然后以弹出窗口的形式将其设置为电子邮件字段。
要从输入字段获取值
JS:var email = document.getElementById('id_name');
Jquery:var email = $('#id_name').val();
将值设置为输入字段:
JS:document.getElementById("id_name").value = email;
Jquery:$('#id_name').val(email);
<div class="well">
<form action="#">
<div class="row email">
<input class="btn btn-lg required_email" name="email" id="email" type="email" placeholder="MY EMAIL TO GET FIRST MY LIFE-TIME PREMIUM ACCESS">
</div>
<div class="row okbutton">
<button class="btn btn-info button" data-toggle="modal" data-target="#enquirypopup" onclick="copyEmail();" >Subscribe</button>
</div>
</form>
</div>
<div id="enquirypopup" class="modal fade in" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content row">
<div class="modal-header custom-modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Enquire Now</h4>
</div>
<div class="modal-body">
<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="//FellowsNow.us11.list-manage.com/subscribe/post?u=fa1e6ec5c7d8f4d1f04c123e1&id=c761d217cf" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2>Subscribe to our mailing list</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
<label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
</label>
<input type="email" value=" <?php echo $_POST['EMAIL'];?>" name="EMAIL" class="required email" id="mce-EMAIL">
</div>
<div class="mc-field-group">
<label for="mce-FNAME">First Name </label>
<input type="text" value="" name="FNAME" class="" id="mce-FNAME">
</div>
<div class="mc-field-group">
<label for="mce-LNAME">Last Name </label>
<input type="text" value="" name="LNAME" class="" id="mce-LNAME">
</div>
<div class="mc-field-group size1of2">
<label for="mce-MMERGE3">Phone Number </label>
<input type="text" name="MMERGE3" class="" value="" id="mce-MMERGE3">
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_fa1e6ec5c7d8f4d1f04c123e1_c761d217cf" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='MMERGE3';ftypes[3]='phone';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
</div>
</div>
</div>
</div>
<script type="text/javascript>
function copyEmail(){
var email = document.getElementById('email');
document.getElementById("mce-EMAIL").value = email;
return true;
}
</script>