事件侦听器似乎未侦听或未获取必要/期望的值

时间:2019-05-17 08:16:58

标签: javascript

事件侦听器未收到任何有意义的数据。解释复杂。我单击页面上的“功能按钮”,这会触发ajax请求并将表单加载到名为“ ajaxDiv”的页面上的div中。

提交表单时,我想使用e.preventDefault()并使事件侦听器获取表单数据,即输入到每个表单字段的值。到目前为止,我只获得了特定的输入字段ID,而没有获得其他输入字段ID,也没有输入到表单中的任何值。

以下是到目前为止的收听者。

console.log();似乎表明只返回表单的ID。没有表单字段的任何ID,也没有输入到表单的数据。

document.getElementById("ajaxDiv").addEventListener("submit", function(e) {
    e.preventDefault();
    var record_id = e.target.id;
    var target = e.target;

    console.log( 'target  =    ' + target);
    console.log( 'record_id   ' + record_id );

    if ( record_id ) {
        if ( record_id === email_address1 ) {
            var email_address1 = e.target.id;
        }
    }
 });

返回到控制台的值为“ start_layaway_form”

接下来是html表格。

<div id='initiate-layaway-form'>
  <form id='start_layaway_form'>
    <input type='hidden' name='order_function' value='initiate-layaway' />
    <input type='hidden' name='order_id' value="$order_id" />
    <input type='hidden' name='business_id' value="$business_id" />
    <table>
      <tr>
        <td>
          <p>Enter email address</p>
          <label for='email_address1'></label>
          <input type='text' id='email_address1' name='email_address1' placeholder='Enter email address' />
        </td>
      </tr>
      <tr>
        <td>
          <p>Re-enter email address</p>
          <input type='text' id='email_address2' name='email_address2' placeholder='Re-enter email address' />
        </td>
      </tr>
      <tr>
        <td>
          <p>OR</p>
        </td>
      </tr>
      <tr>
        <td>
          <p>Enter Post Code</p>
          <input type='text' id='post_code' name='post-code' placeholder='Enter Post Code' />
        </td>
      </tr>
      <tr>
        <td>
          <p>Enter House Number</p>
          <input type='text' id='house_number' name='house-number' placeholder='Enter House Number' />
        </td>
      </tr>
      <tr>
        <td>
          <input type='submit' id='submit' value='Start Layaway' />
        </td>
      </tr>
    </table>
  </form>
</div>

因此,在ajax已经生成我的表单并将其推送到div“ ajaxDiv”中的情况下,我想捕获在侦听器中输入到表单的值,以便可以再次通过ajax将这些值输入到我的数据库中。

似乎还无法掌握收听者的概念。 :(

我们将不胜感激。
爵士乐

0 个答案:

没有答案