javascript - 填充多选下拉菜单

Question

我有一个在 CEWP 中使用的 SharePoint jquery 表单，表单上的元素之一是多选元素，它是一个允许进行多项选择的下拉列表。例如:

 <select name="cars" multiple>
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="opel">Opel</option>
    <option value="audi">Audi</option>
 </select>

需要使用 SharePoint 列表中的数据预先选择该元素。我有一个名为汽车的列，数据以逗号分隔(例如:Saab、Audi)。

那么，使用 spservices 和 jquery，我如何预先选择带有“Saab”和“Audi”的元素？这是我在 jsFiddle 中的内容: http://jsfiddle.net/rXGmc/然后我需要将它应用到共享点。感谢您提供的任何帮助或见解。

Answer 1

你的 fiddle 没有工作，因为你没有包括 jQuery(在左边的框架和扩展选项中)并且因为你的选择器有一些问题:

'select[name="cars"] option[value="saab"], select[name="Volvo"] option[value="audi"],option[value="benz"],'
//                              incorrect name here ----^^^^^       and a trailing comma ----------------^

选择器的第一部分:

select[name="cars"] option[value="saab"]

...实际上会选择“saab”选项，然后是第二部分:

, select[name="Volvo"] option[value="audi"]

...正在尝试选择一个选项元素，该元素是具有 name="Volvo" 的 select 元素的子元素，但没有具有该名称的 select。然后是第三部分:

, option[value="benz"],

...正在尝试选择带有“benz”的选项，而不管它可能属于哪个选择元素。

但是整个选择器不起作用，因为它有一个尾随逗号。

所以解决这些问题，它将在“saab”和“audi”上运行:

'select[name="cars"] option[value="saab"], select[name="cars"]  option[value="audi"]'

演示:http://jsfiddle.net/rXGmc/2/

综上所述，一个更简洁的选择是使用 .find() 或 .children():

$('select[name="cars"]').children('[value="saab"],[value="audi"]')
                        .attr('selected', 'selected');

演示:http://jsfiddle.net/rXGmc/4/