Как получить доступ к действию form1 и данным с помощью кнопки отправки формы form в html - PullRequest
Новая
       60

Как получить доступ к действию form1 и данным с помощью кнопки отправки формы form в html

0 голосов
/ 13 марта 2019

Я нашел xhtml, который выглядит так: 

        <div class="mail_area">
        <div class="mail">
        <div class="mail_lef"></div>
        <div class="mail_cen">
        <form action="">
        <input type="text" value="Enter your E-mail for instant 
        access..." name="Enter your E-mail" class="txtinput"      onfocus="if(this.value==this.defaultValue)this.value=''" onblur="if(this.value=='')this.value=this.defaultValue"/>
</form>
</div>
<div class="mail_rig"></div>
</div>
</div>
<div class="arrow_area">
<div class="left_arr"></div>
<div class="cen_but">
<span class="cen_text"><sup class="red">*</sup>We value your privacy and would never share your information.</span>
            <form action="">
                <input type="button" class="button" name="submit" align="middle"/>
            </form>
        </div>
        <div class="rig_arr"></div>
    </div>

В первом классе я собираюсь добавить метод и действие. Похоже, что вторая форма была создана таким образом, чтобы ее можно было выровнять с другими изображениями.

Итак, мой вопрос, как я могу настроить кнопку во второй, чтобы использовать входную информацию и получить доступ к атрибуту действия первой формы?

Спасибо за помощь.

Ответы [ 2 ]

0 голосов
/ 13 марта 2019

Чтобы отменить <form> отправку данных с помощью кнопки, вы должны:

A. Присвойте идентификатор первой форме (в демоверсии #form1)

B. Добавьте следующие атрибуты для кнопки:

  1. Заменить type="button" на type="submit"
  2. Добавить formmethod="post" (или get)
  3. Добавить formaction="https://httpbin.org/post" (значение является тестовым сервером в реальном времени)
  4. Добавить form="form1" (значение является идентификатором целевого <form>)

Демо

Эта демонстрация отправляет на тестовый сервер в режиме реального времени поиск данных формы в JSON, отправленных в качестве ответа, чтобы убедиться, что он работает 

<div class="mail_area">
  <div class="mail">
    <div class="mail_lef"></div>
    <div class="mail_cen">

      <form id='form1' action="">
        <input type="text" value="Enter your E-mail for instant access..." name="Enter your E-mail" class="txtinput" onfocus="if(this.value==this.defaultValue)this.value=''" onblur="if(this.value=='')this.value=this.defaultValue" />
      </form>

    </div>
    <div class="mail_rig"></div>
  </div>
</div>
<div class="arrow_area">
  <div class="left_arr"></div>
  <div class="cen_but">
    <span class="cen_text"><sup class="red">*</sup>We value your privacy and would never share your information.</span>

    <form action="">
      <input type="submit" class="button" name="submit" formmethod="post" formaction="https://httpbin.org/post" form="form1">
    </form>

  </div>
  <div class="rig_arr"></div>
</div>
0 голосов
/ 13 марта 2019

Самый простой способ сделать это - превратить это в одну форму вместо двух. В противном случае вам придется использовать javascript. 

<form action="">
    <div class="mail_area">
        <div class="mail">
            <div class="mail_lef"></div>
            <div class="mail_cen">
                    <input type="text" value="Enter your E-mail for instant access..." name="Enter your E-mail" class="txtinput" />
                </form>
            </div>
            <div class="mail_rig"></div>
        </div>
    </div>
    <div class="arrow_area">
        <div class="left_arr"></div>
        <div class="cen_but">
            <span class="cen_text"><sup class="red">*</sup>We value your privacy and would never share your information.</span><br>
            <input type="submit" class="button" name="submit" align="middle"/>
        </div>
        <div class="rig_arr"></div>
    </div> 
</form>
...