Question

我正在写一个简单的表格，但是遇到了问题。表单必须生成这样的网址 https://website.com/properties/hotelvinadelmar?locale=es&check_in_date=22-03-2019&check_out_date=25-03-2019&number_adults=4&number_children=9 / properties /之后的部分（在本例中为“ hotelvinadelmar”）是特定酒店的代码，其余部分则是客户提供的信息，以检查是否有空房。我写了这个表格：附随：

这几乎可以工作，但是会生成一个这样的URL（...）/ properties /？test = hotelvinadelmar？locale = es＆number_adults = 1（...）哪个正在创建这样的网址 [表单操作（我输入的网址）] [选项名称] [选定的选项值] 但是事情一定是这样 [表单操作（我输入的网址）] [选择的选项值] 如何做到这一点？提前致谢！

Answer 1

这是正确的行为，因为提交的表单数据test=hotelvinadelmar将添加到URL之后 (...)/properties/，为了获得所需的结果，您可以尝试将action属性添加为表单中的<form action="/hotel">并将选择更改为：

<select name="hotelname" required>       
        <option value="hotelvinadelmar">Viña del Mar</option>
        <option value="hotelsantiago1">Nueva Providencia</option>
        <option value="hotelsantiago2">Providencia</option></select> 
    <br><br>
</select>

生成的链接将为：(...)/properties/hotel?name=hotelvinadelmar(...)

或者您可以将JavaScript函数与onSubmit事件一起使用，例如：

<script>
function submitForm(){
    var hotelName = document.getElementById('hotelName').value;
    var param1Value = document.getElementById('id').value;
    switch(hotelName) {
        case 'hotelvinadelmar':
           window.location.href = '/hotelvinadelmar?param1=' + param1Value + '&param2=' + (...);
           break;
        case 'hotelsantiago1':
           window.location.href = '/hotelsantiago1?param1=' + param1Value;
           break;

    }
    // stop submit
    return false;
}
</script>
<form onsubmit="submitForm()" method="get">
    <select id="hotelName" required>       
        <option value="hotelvinadelmar">Viña del Mar</option>
        <option value="hotelsantiago1">Nueva Providencia</option>
        <option value="hotelsantiago2">Providencia</option></select> 
    </select> 
    <input type="submit" value="submit"/>
</form>

使用<select>使“名称”不出现在url上

1 个答案: