javascript - 我想将表单输入作为变量获取

Question

 <form id="notification_form" >
        <div style="display: flex;" id="xx">


        <div style="float: left; width: 40%;margin-left: 1%;">

      <label style="margin-top: -2px">message text on area entrance</label>
        <input style="margin-top: -11px" type="text" id="notf_msg_entrance">

            <label style="margin-top: -11px">message text on area exit</label>
        <input style="margin-top: -11px" type="text" id="notf_msg_exit">
        </div>
        <div style="width: 40%;margin-left: 10%;margin-top: 12px;" >
<!--        <div><input type="checkbox" name="push" value="1"  id="notf_push"> <label>push </label></div>-->
            <div id="right_div">
                <select class='form-control inputstl' id="select_aud"></select>
            <label style="margin-left: 7px;">sms notification</label>
        <input type="tel" id="notf_tel_num" class='form-control inputstl'>
            <label style="margin-left: 7px;">mail notification</label>
        <input type="mail" id="notf_mail" class='form-control inputstl'>
            <div>
              <input style="margin-left: 2px" type="checkbox" class="emergency" value="1" > 
              <label style="float: right;margin-top: -1px;margin-right: 25px;">emergency notification</label></div>
        </div>
            </div>

            </div>
            </form>

当我制作 console.log($('#notification_form').serialize()); 时，它不会给我响应，而它会在另一个表单上给我响应

Answer 1

所有表单元素都需要一个 name 属性才能包含在最终提交的表单数据中。如果它们不包含此内容，则浏览器在准备要发送到服务器的表单数据时将忽略它们。

同样的规则也适用于 jQuery 的 serialize() 方法，因为它尝试应用与您在不使用 JavaScript 的情况下提交表单时浏览器将使用的相同逻辑。

例如您的第一个输入框可以更改为如下内容:

<input style="margin-top: -11px" type="text" id="notf_msg_entrance" name="msg_entrance">

将名称设置为您希望传输到服务器时显示的任何名称。将此应用到表单中的所有表单元素(输入(包括文本框、复选框、单选框)、选择、文本区域等。