单击链接存储变量传递以在新页面上选择答案

【问题标题】：Click link store variable pass to select on new page单击链接存储变量传递以在新页面上选择
【发布时间】：2017-12-13 01:41:24
【问题描述】：

我在几个页面上有链接，其中存储了房间的名称

<a href="/booking/" class="book" data-book="Room One">
<a href="/booking/" class="book" data-book="Room Two">

单击时，我想存储数据变量并将房间名称传递给新页面上的表单并预选选择选项。

我试过这个：

$('.book').on('click', function(){
var roomSuiteLink = $(this).data('book');
});

我希望“roomSuiteLink”的值成为选定的选择选项。我一直在尝试这个没有运气：

function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
}
var roomSuite = getURLParameter('roomSuiteLink');           
$('#my-select').val( roomSuite );

然后在新页面上我有一个选择菜单：

<select id="my-select" name="my-select">
<option value="Room One">Room One</option>
<option value="Room Two">Room Two</option>
</select>

我不想在 URL 中添加任何内容，例如：/booking/?room name。我可以用 jquery 做到这一点还是需要一个会话变量？

谢谢

【问题讨论】：

标签： jquery variables select

【解决方案1】：

你需要将selected属性设置为true

$('#my-select [value="' + roomSuite + '"]').prop('selected', true)

JSFiddle result

【讨论】：

谢谢。我在 JSFiddle 上看到了它的工作原理。如果我将“?roomSuiteLink=Room Name”添加到预订 URL，如下所示：/booking/?roomSuiteLink=Room Name - 它确实有效。我想避免这种情况，但我会检查这是否是一个选项。理想情况下，如前所述，我想避免这种情况。 Difster 在下面说我必须使用 cookie 或会话 - 有人可以确认吗？
@Rob 你可以使用localStorage codepen.io/anon/pen/awRqBw
嘿 Miquel - 再次感谢。现在的问题是使用 event.preventDefault() 会阻止页面转到 /booking/ 页面。 Room One 链接在不同的页面上。