2015-07-31 2 views
-2

У меня есть эта разметка. Я пытаюсь написать селектора jquery, чтобы получить все элементы внутри списка заказов шаблонов, чье имя имеет строку Works. Мое требование состоит в том, что у меня есть несколько упорядоченных списков. Если я удалю любой список, я хочу переупорядочить индексы в атрибуте name.Как перебирать атрибуты дочернего элемента и переименовывать его в JQuery?

<ol class="template"> 
    <li> 
     <span class="label" name="Works[0].Id"></span> 
    </li> 
    <li> 
     <input id="textBox" type="text" value="" name="Works[0].Body"> 
    </li>      
    <li> 
     <input type="checkbox" id="checkbox" value="" name="Works[0].IsCompleted">       
     <input type="button" id="delete" value="Delete">      
    </li>     
</ol> 

<ol class="template"> 
    <li> 
     <span class="label" name="Works[1].Id"></span> 
    </li> 
    <li> 
     <input id="textBox" type="text" value="" name="Works[1].Body"> 
    </li>      
    <li> 
     <input type="checkbox" id="checkbox" value="" name="Works[1].IsCompleted">       
     <input type="button" id="delete" value="Delete">      
    </li>     
</ol> 

<ol class="template"> 
    <li> 
     <span class="label" name="Works[2].Id"></span> 
    </li> 
    <li> 
     <input id="textBox" type="text" value="" name="Works[2].Body"> 
    </li>      
    <li> 
     <input type="checkbox" id="checkbox" value="" name="Works[2].IsCompleted">       
     <input type="button" id="delete" value="Delete">      
    </li>     
</ol> 

Мой подход заключается в том, что после того, как вы нажмете кнопку удаления, я удалю любой список заказов. Я возьму каждый упорядоченный список и итерацией через меня изменит индекс на 0 до длины списка. Но я не получаю правильный селектор, чтобы ловить элементы внутри упорядоченного списка, чей атрибут имени имеет значение, начиная с Works. Пожалуйста, предложите лучший селектор.

+0

Где попытка JavaScript? – GolezTrol

ответ

0

Селектор вы хотите:

$("ol.template [name^=Works]") 

Это селектор JQuery Attribute Starts With.

К сожалению, name недействительный атрибут на <span> элементов. Он должен использоваться только для следующих элементов:

<button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param>

См https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes

+0

Спасибо! Можем ли мы получить это для каждого шаблона. i.e Я хочу пройти через каждый шаблон. – DfrDkn

+0

Вы можете использовать его в любое время, когда хотите найти все элементы с атрибутом, который начинается с того же самого. – Barmar

+0

Вы имели в виду $ (this) .find ("[name^= Works]")? – DfrDkn

0

здесь Чистый JavaScript работает с браузерами майоров

var ol = document.getElementsByTagName('ol'); 
var temp = ol.getElementsByClassName('template'); 
for(var i=0;i<temp.length;i++){ 
if(temp[i].name.indexOf('Works')==0){ // if name attribute start with 'Work' 
//if(temp[i].name.indexOf('Works') > -1){ => if name attribute contains 'Work' 
//if(temp[i].name.indexOf('Works') == -1){ => if name attribute is not contains 'Work' 
//if(temp[i].name.indexOf('Works') == temp[i].name.length - 'Works'.length - 1){ => if name attribute is ended with 'Work' 
// now play with with temp[i] 
temp[i].style.background = 'yellow'; 
} 
} 
Смежные вопросы