如何在表单的下一步显示用户输入的输入?我已经尝试过ajax和javascript,但无法正常工作。
下面是代码
[md-form]
<div class="vidbees_field active" id="step1">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
<div class="container">
<ul class="progressbar">
<li class="step active" onclick="currentSlide(1)">Question / Statement</li>
<li class="step" onclick="currentSlide(2)">More Text</li>
<li class="step" onclick="currentSlide(3)">Call to Action</li>
<li class="step" onclick="currentSlide(4)">Website Url</li>
</ul>
</div>
</div>
</div>
<!------------------------------------TIRED OF--------------------------------------------->
<div class="form_field">
<img src="https://vidbees.com/wp-content/uploads/2019/02/hutman-1.png">
[md-text label=""]
<div class="input_addon">
[text* slide1-input1 id:step1input1 "TIRED OF"]
<label for="step1input1" class="clear_btn" onclick="document.getElementById('step1input1').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
<!------------------------------------MISLEADING LISTINGS?--------------------------------------------->
[md-text label=""]
<div class="input_addon">
[text* slide1-input2 id:step1input2 "MISLEADING LISTINGS?"]
<label for="step1input1" class="clear_btn" onclick="document.getElementById('step1input2').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
[sc name="Note Field"]
</div>
[sc name="Steps Button"]
</div>
<div class="vidbees_field" id="step2">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
<div class="container">
<ul class="progressbar">
<li class="step active" onclick="currentSlide(1)">Question / Statement</li>
<li class="step active" onclick="currentSlide(2)">More Text</li>
<li class="step" onclick="currentSlide(3)">Call to Action</li>
<li class="step" onclick="currentSlide(4)">Website Url</li>
</ul>
</div>
</div>
</div>
<div class="form_field">
<img src="https://vidbees.com/wp-content/uploads/2019/02/hutman-2.png">
<!------------------------------------CALL US--------------------------------------------->
[md-text label=""]
<div class="input_addon">
[text* slide2-input1 id:step2input1 "CALL US( Please enter your text here)"]
<label for="step2input1" class="clear_btn" onclick="document.getElementById('step2input1').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
<!------------------------------------WE KEEP IT REAL!--------------------------------------------->
[md-text label=""]
<div class="input_addon">
[text* slide2-input1 id:step2input2 "WE KEEP IT REAL!"]
<label for="step2input2" class="clear_btn" onclick="document.getElementById('step2input2').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
<!-----------link----------------->
<img style= height:200px; width: 42px; src="https://vidbees.com/wp-content/uploads/2019/02/hutman-1.png">
i want to make this static label field into dynamic field, when custome enter his name then his name should be printed here below picture
[md-text label=""]
<div class="input_addon">
<label class="clear_btn" > TIRED OF MISLEADING LISTINGS?
</label>
</div>
[/md-text]
[sc name="Note Field"]
</div>
[sc name="Steps Button"]
</div>
<div class="vidbees_field" id="step3">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
<div class="container">
<ul class="progressbar">
<li class="step active" onclick="currentSlide(1)">Question / Statement</li>
<li class="step active" onclick="currentSlide(2)">More Text</li>
<li class="step active" onclick="currentSlide(3)">Call to Action</li>
<li class="step" onclick="currentSlide(4)">Website Url</li>
</ul>
</div>
</div>
<p class="form_tip logo__tip">
Now it's time to add your logo. Click the yellow CHOOSE FILE button below the image
</p>
</div>
<div class="form_field">
<img src="https://vidbees.com/wp-content/uploads/2019/02/hutman-CTA.png">
[md-text label=""]
<div class="input_addon">
[text* call-to-action-1 id:callactioninput1 "LISTINGS YOU"]
<label for="callactioninput1" class="clear_btn" onclick="document.getElementById('callactioninput1').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
[md-text label=""]
<div class="input_addon">
[text* call-to-action-2 id:callactioninput2 "CAN TRUST"]
<label for="callactioninput2" class="clear_btn" onclick="document.getElementById('callactioninput2').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
[md-text label=""]
<div class="input_addon">
[text* call-to-action-3 id:callactioninput3 "FROM PEOPLE YOU CAN DEPEND ON!"]
<label for="callactioninput3" class="clear_btn" onclick="document.getElementById('callactioninput3').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
[sc name="Note Field"]
</div>
[sc name="Steps Button"]
</div>
<div class="vidbees_field" id="step4">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
<div class="container">
<ul class="progressbar">
<li class="step active" onclick="currentSlide(1)">Question / Statement</li>
<li class="step active" onclick="currentSlide(2)">More Text</li>
<li class="step active" onclick="currentSlide(3)">Call to Action</li>
<li class="step active" onclick="currentSlide(4)">Website Url</li>
</ul>
</div>
</div>
</div>
<div class="form_field">
<img src="https://vidbees.com/wp-content/uploads/2019/02/hutman-WEBSITE.png">
[md-text label="Website URL"]
<div class="input_addon">
[text website-url id:weburlinput "WWW.YOURWEBSITE.COM"]
<label for="weburlinput" class="clear_btn" onclick="document.getElementById('weburlinput').value = ''">
<i class="fa fa-trash" aria-hidden="true"></i>
</label>
</div>
[/md-text]
</div>
[sc name="Steps Button"]
</div>
<div class="vidbees_field" id="step5">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title active-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
</div>
<div class="form_tip logo_info">
<i class="fa fa-lightbulb-o" aria-hidden="true"> </i>
<p> Now it's time to add your logo. Click the yellow CHOOSE FILE button below the image. </p>
</div>
</div>
<div class="form_field" id="file_field">
<img src="https://vidbees.com/wp-content/uploads/2019/02/hutman-LOGO.png">
[md-file label="" nofile=""]
[file logo-file]
[/md-file]
</div>
[sc name="Steps Button"]
</div>
<div class="vidbees_field" id="step6">
<div class="form_steps" id="form_steps">
<div class="content">
<div class="container">
<ul class="progressbar-title">
<li class="step-title active-title" onclick="currentSlide(1)"><span>Enter Text</span></li>
<li class="step-title active-title" onclick="currentSlide(5)"><span>Your Logo</span></li>
<li class="step-title active-title" onclick="currentSlide(6)"><span>More Info</span></li>
</ul>
</div>
</div>
<div class="form_tip add_info_tip">
<i class="fa fa-lightbulb-o" aria-hidden="true"> </i>
<p> Almost done...give us your NAME, CONTACT NUMBER, and EMAIL and we'll contact you within 24 hours to deliver your video. </p>
</div>
</div>
<div class="form_field">
[md-text label="Your Name (required)" class="vid_input"]
[text* your-name Required]
[/md-text]
</div>
<div class="form_field">
[md-text label="Contact Number (required)" class="vid_input"]
[text* contact-number]
[/md-text]
</div>
<div class="form_field">
[md-text label="Your Email (required)" class="vid_input"]
[email* your-email] </label>
[/md-text]
</div>
<div class="form_note">
<span class="required">NOTE: </span> Want to customize this video to add your own text? How about changing the music or adding a background at the end of the video? There are so many things you can do to customize this video so click CUSTOMIZE
</div>
<div class="steps_btn">
<div class="wrap_prev">
<input type="button" class="prev_btn" onclick="plusSlides(-1)" value="Previous" />
</div>
</div>
<div class="vidbees_submit">
[submit "SUBMIT AND PAY"]
</div>
</div>
[/md-form]