添加title属性与.append（）

的Javascript，jQuery的，HTML添加title属性与.append（）

我动态添加选择选项的选择框，动态地选择选项。我将数组中的每个唯一元素添加到select元素中作为选项。它效果很好，但我需要同时添加一个title属性，其值与选项文本相同。最终目标是为每个选项制作工具提示。

所以不是<option>value</option>，它看起来像

<option title="value">value</option>

这是否有意义？

当前HTML：

<select id="Process_Issue" class="fieldLabel2 IncidentInputField dynamicFields1"></select>

JS：

$.each(eliminateDuplicates(aryProcess), function (key, value) { $('#Process_Issue').append($("<option/>", { text: cleanNulls(value) })); });

来源

2013-11-26 dah97765

你可以只是在附加指定标题：

JSFiddle

HTML

<select id="my_select"></select>

$('#my_select').append('<option title="value1">value1</option>'); 
$('#my_select').append('<option title="value2">value2</option>'); 
$('#my_select').append('<option title="value3">value3</option>');

来源

2013-11-26 20:41:37 MonkeyZeus

到目前为止所有的答案都是正确的，但是你已经有了它，并且它更符合我当前的代码。我明显地把它放在一个循环中（而不是value1，value2等）。感谢您的迅速反应！ – dah97765

很高兴我能提供帮助，我认为一个更直接的答案就是你想要的。 – MonkeyZeus

您似乎是使用相同的选择多次为阵列中的每个迭代。而是缓存它并节省一些查找时间。

var $select = $('#Process_Issue'); 
$.each(eliminateDuplicates(aryProcess), function (key, value) { 
    var val = cleanNulls(value); 
    $select .append($("<option/>", { 
      text: val, 
      title: val 
    })); 
});

如果这不起作用使用.attr方法挂钩的属性的元素。

var $select = $('#Process_Issue'); 
$.each(eliminateDuplicates(aryProcess), function (key, value) { 
    var val = cleanNulls(value); 
    $('<option/>').attr({ 
     text: val, 
     title: val 
    }).appendTo($select); 
});

来源

2013-11-26 20:45:47

你是对的。但是，在每个选择框中只会有几个选项（多个选择框，全部按需动态发生），但每个选项都有大约12个或更少的选项，所以在这种情况下我并不关心速度。好答案！ – dah97765

您可以设置title属性

$('#Process_Issue').append(
    $("<option/>", { text: value }).attr("title",value) 
);

这里是工作示例http://jsbin.com/ozudoTod/1/

来源

2013-11-26 20:46:43 Shyju

根据MonkeyZeus的回答，这几乎就是我最终得出的结论。我喜欢格式：$（'＃Process_Issue'）。append（$（''））;而不是你有什么（以及我发布这个问题时所拥有的）。我认为它看起来更好，一眼就看不到混乱。 – dah97765

一个更清洁的方式与所有值之前创建元素然后附加像这样：

value = cleanNulls(value); 
var option = $('<option/>', { 
    title: value, 
    text: value 
}); 

$('#Process_Issue').append(option);

这种方法是一个更清洁，更容易阅读/维护n

来源

2013-11-26 20:50:57 kkemple

与Sushanth的答案非常相似..也是一个很好的答案。谢谢！ – dah97765

添加title属性与.append（）

回答

相关问题