Question

我目前有以下选择列表：

<select name="input_3" id="input_2_3" class="medium gfield_select" tabindex="3">
    <option value=" ">-- Select an Image --</option>
    <option value="mysite.com/wp-content/uploads/2013/11/wedding_3.jpg">wedding 3</option>
    <option value="mysite.com/wp-content/uploads/2013/11/wedding_2.jpg">wedding 2</option>
    <option value="mysite.com/wp-content/uploads/2013/11/wedding_1.jpg">wedding 1</option>
</select>

将这个当前的选择/下拉列表与jQuery一起使用，如何在document.ready函数中转换此选择列表，而不是在<select>...</select>标记之间包含所有内容，如下所示：

<select name="input_3" id="input_2_3" class="medium gfield_select" tabindex="3">
    <option value=" ">-- Select an Image --</option>
    <option value="wedding 3" title="mysite.com/wp-content/uploads/2013/11/wedding_3.jpg">wedding 3</option>
    <option value="wedding 2" title="mysite.com/wp-content/uploads/2013/11/wedding_2.jpg">wedding 2</option>
    <option value="wedding 1" title="mysite.com/wp-content/uploads/2013/11/wedding_1.jpg">wedding 1</option>
</select>

基本上，使用value =“mysite.com / ...”现在应该是title =“mysite.com / ...”，值现在应该等于选项标签，例如“wedding 3”。

注意：我想忽略第一个<option>，其中值=“”，因为我需要保持不变。

Answer 1

这是一个基本的解决方案，它依赖于attr()形式的函数：

$(".gfield_select > option:gt(0)").attr("title", function() {
    return this.value;
}).attr("value", function() {
    return $(this).text();
});

Answer 2

您的示例让我感到困惑，但如果我正确阅读，您需要使用jQuery的.attr（）函数，它允许您更改title等属性和.val（）函数，它可以让您改变元素值。

例如：

$("option").attr("title","url").val("url");

请参阅.attr（）（http://api.jquery.com/attr/）和.val（）（http://api.jquery.com/val/）的jQuery文档。

<强>更新

如果我理解正确，你首先要给title属性赋值... value，然后使value等于该选项的文本。

$("option").each(function()
{
    $(this).attr("title", this.value).val($(this).text());
});

如何使用jQuery转置选择列表选项值

2 个答案: