Подключите разделенные имена запятыми / пробелами к <li>, созданным с помощью jQuery - PullRequest
1 голос
/ 12 июля 2011

У меня есть несколько имен актеров, разделенных запятыми, и я пытаюсь получить каждое имя в этом списке и подключить его к динамически создаваемому собственному li под ul, используя заглавные буквы только и обрезая запятые / пробелы (единственный пробел, который не должен быть обрезан, находится между "john lock", так как между именем нет запятой), например:

var cast = ('jack, kate ,sawyer , john lock ,, hurley')

<ul id="cast-members">
<li>Jack</li>
<li>Kate</li>
<li>Sawyer</li>
<li>John Lock</li>
<li>Hurley</li>
</ul>

Есть идеи, как этого добиться с помощью jQuery?

1 Ответ

1 голос
/ 12 июля 2011

Это должно сделать это

var cast = 'jack, kate ,sawyer , john lock ,, hurley';
var castlist = cast.split(',');

var $ul = $('<ul>'); //create an in-memory <ul> element to hold our elements

$.each(castlist, function(idx,val){ // for each item in the split array
    var value = $.trim(val).replace(/\b\S/g, function(m){return m.toUpperCase();}); // trim and capitalize the item
    if (value.length > 0){ // if its length > 0 (non-empty)
        var $li = $('<li>', { // create a <li> element
            html: $('<a>', { // set its html to be a new <a> element
                href:'Bio.html#'+value, // with a href
                text:value // and a text value
            })
        });
        $ul.append($li); // append our new <li> to the <ul>
    }
});
$('.lost-cast').append( $ul );  // append the filled <ul> in the /lost-cast element 

демо на http://jsfiddle.net/gaby/gvb6n/

...