克隆多个 Dropbox 选择的选项并将它们组合成 1 个 appendto
Clone multiple dropbox selected options and combined them in to 1 appendto
我有多个下拉菜单,我想合并下拉菜单和文本的 selected 选项,并将其附加到 <p>
。
我最近能够将 URL 参数编码为自动 select 某些下拉选项。这与我猜想的相反。如何从下拉选项中生成 URL 参数。
当用户制作他们的 selection 时,他们可以单击按钮 (getshareinfo),这将自动生成参数并将其附加到下面的 <p>
。
到目前为止,这就是我所坚持的,我已经尝试将文本直接添加到 select 或通过 '' 和 + 但这似乎不起作用。
它应该做什么的例子:
框 1:驾驶
方框 2:快
生成了 URL 文本:www.domain.com?user=driving&speed=fast
$('#getshareinfo').on('click', function() {
$("#env-select option:selected").clone().appendTo("#shareinfo");
$('#src option:selected').clone().appendTo("#shareinfo");
})
<select id="env-select">
<option value="driving">driving</option>
<option value="biking">biking</option>
<option value="walking">walking</option>
</select>
<select id="src">
<option value="slow">slow</option>
<option value="average">average</option>
<option value="fast">fast</option>
</select>
<button type="button" id="getshareinfo">Share</button>
<br>
<p id="shareinfo"></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
已编辑
价值在哪里?
就这样
$("#shareinfo").text( $("#env-select").val()+ $("#src").val())
连接或者如果您需要 URL
const url = new URL("https://www.example.com")
url.searchParams.set("user",$("#user").val())
url.searchParams.set("speed",$("#speed").val())
$("#shareinfo").html(`<a href="${url.toString()}">Click</a>`)
我有多个下拉菜单,我想合并下拉菜单和文本的 selected 选项,并将其附加到 <p>
。
我最近能够将 URL 参数编码为自动 select 某些下拉选项。这与我猜想的相反。如何从下拉选项中生成 URL 参数。
当用户制作他们的 selection 时,他们可以单击按钮 (getshareinfo),这将自动生成参数并将其附加到下面的 <p>
。
到目前为止,这就是我所坚持的,我已经尝试将文本直接添加到 select 或通过 '' 和 + 但这似乎不起作用。
它应该做什么的例子:
框 1:驾驶
方框 2:快
生成了 URL 文本:www.domain.com?user=driving&speed=fast
$('#getshareinfo').on('click', function() {
$("#env-select option:selected").clone().appendTo("#shareinfo");
$('#src option:selected').clone().appendTo("#shareinfo");
})
<select id="env-select">
<option value="driving">driving</option>
<option value="biking">biking</option>
<option value="walking">walking</option>
</select>
<select id="src">
<option value="slow">slow</option>
<option value="average">average</option>
<option value="fast">fast</option>
</select>
<button type="button" id="getshareinfo">Share</button>
<br>
<p id="shareinfo"></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
已编辑
价值在哪里? 就这样
$("#shareinfo").text( $("#env-select").val()+ $("#src").val())
连接或者如果您需要 URL
const url = new URL("https://www.example.com")
url.searchParams.set("user",$("#user").val())
url.searchParams.set("speed",$("#speed").val())
$("#shareinfo").html(`<a href="${url.toString()}">Click</a>`)