Question

好的，我正在尝试使用HTML中的表单标签在此处传递此类链接的参数

https://pyramisaegypt.seebooking.com/#/booking-engine/room-list?property_id=445586&checkin=2018-11-22&checkout=2018-11-23&noOfAdults=1&noOfChildren=1&noOfRooms=1&promo_code=

但是由于某些原因，在我点击“提交”后，它总是变成这个

https://pyramisaegypt.seebooking.com/?property_id=445586&checkin=2018-11-22&checkout=2018-11-23&noOfAdults=1&noOfChildren=1&noOfRooms=1&promo_code=#/booking-engine/room-list

请注意，哈希之后和问号后面的内容都会在网址末尾传输

页面网址为http://pyramisaegypt.com/test-page/

我的代码是

<form id="reservation-widget-wrap-form-element" style="background-color: #f0f0f0; color: #777; padding: 10px; padding-right: 5px; margin-bottom: 20px;" action="https://pyramisaegypt.seebooking.com/#/booking-engine/room-list" method="get" target="_blank">

<div id="children-wrap" style="width: 20%; display: inline-block">
<div class="caption">Hotels</div>
<p><select id="reservation-widget-hotels" style="width: 100%;height: 32px;padding-left: 5px;margin-bottom: 0px;" name="property_id"><option value="547027">Pyramisa Cairo Suites Hotel</option><option value="568389">Pyramisa Sahl Hasheesh Resort</option><option value="31070">Pyramisa Sharm El Sheikh Resort</option><option value="35520">Pyramisa Isis Luxor Resort</option><option value="445586">Pyramisa Isis Island Aswan Resort</option><option value="450628">Pyramisa Isis Corniche Aswan Resort</option></select></p>
</div>

<div id="check-in-wrap" style="display: inline-block; /* background: white;">
<div class="caption">Check-in date</div>
<p><input id="reservation-widget-checkin" class="hasDatepicker" style="width: 125px;height: 50%;" name="checkin" type="date"></p>
</div>
<div id="check-out-wrap" style="display: inline-block; padding: 5px;">
<div class="caption">Check-out date</div>
<p><input id="reservation-widget-checkout" class="hasDatepicker" style="width: 125px;height: 50%;" name="checkout" type="date"></p>
</div>

<div id="adults-wrap" style="display: inline-block;">
<div class="caption">Adults</div>
<p style="width: 100px;"><select id="reservation-widget-adults" style="display: inline-block; width: 121.4px; height: 50%;" name="noOfAdults"><option value="1">1</option><option value="2">2</option></select></p>
</div>
<div id="children-wrap" style="display: inline-block;padding: 5px;width: 100px;">
<div class="caption">Children</div>
<p style="
    width: 100px;
"><select id="reservation-widget-children" style="display: inline-block; width: 121.4px; height: 50%;" name="noOfChildren"><option value="0">0</option><option value="1">1</option><option value="2">2</option></select></p>
</div>

<div class="caption">Number of Rooms</div>
<p style="
    width: 100px;
"><select id="reservation-widget-children" style="display: inline-block; width: 121.4px; height: 50%;" name="noOfRooms"><option value="0">0</option><option value="1">1</option><option value="2">2</option></select></p>
</div>

<div id="children-wrap" style="display: inline-block;padding: 5px;width: 100px; margin-left: 1%;">
<div class="caption">Promo Code</div>
<p style="width: 100px;">
<input type="text" style="width: 100%;" name="promo_code">
</p>
</div>

<p style="display: inline-block; width: 20%; margin-bottom: 0px; margin-left: 2%;"><button id="submit-button" type="submit" style="
    background: #b01c30;
    width: 90%;
    border-radius: 6px;
    height: 35px;
    border: none;
">Online Reservation</button></p>
</form>

我尝试了所有解决方案来更改表单动作中哈希的行为，但到目前为止似乎没有任何效果。

Answer 1

也许您应该看看URL的格式。 #之后的任何内容都不会发送到服务器，因为它是指页面上的锚点。因此，“ GET”表格将始终去除这些位。

HTML5表单操作行为

1 个答案: