<html>
<head>
<script>
function A(){
var count=0;
var A=0;
var C=0;
$('.JRow').each(function(){
count++;
alert(count);
$this.$('.BtnSet').each(function(){
A++;
alert(A);
$this.$('.Child').each(function(){
C++;
alert(C);
if(('$(this) input:text[name="A[]"]').length){
alert('$(this) input:text[name="A[]"]').length);
}
});
});
});
return false;
}
</script>
</head>
<body>
<form onsubmit="return A()">
<div class="row JRow">
<input type="text" name="B[]"></input>
<input type="text" name="B[]"></input>
<div class="BtnSet">
<div class="Child">
</div>
<div class="Child">
<input type="text" name="A[]"></input>
<input type="text" name="A[]"></input>
<input type="text" name="A[]"></input>
</div>
</div>
</div>
<div class="JRow"></div>
<input type="submit" value="Submit"></input>
</form>
</body>
</html>
Привет, мне нужно пройти через это. Если я начинаю с класса JRow, первый JRow должен искать, имеет ли он класс BtnSet. Если это так, класс BtnSet должен искать, имеет ли он дочерний класс. В моем примере, поскольку в первом наборе Btnset есть 2 дочерних класса, мне нужно пройти каждый из них, чтобы получить окончательный вывод, который, длина его текстовых полей. Точно так же мне нужно идти каждый узел. Когда дело доходит до второго JRow, у него ничего нет. Мой реальный вопрос настолько сложный, и я поставил перед ним простой вопрос. Пожалуйста, если кто-нибудь знает, что это помогает мне, так как я борется с этим в течение многих дней.
Вы ищете функцию find()
? Это найдет совпадающие потомки выбранного элемента (ов).
Вместо $this.$('.BtnSet')
, вы, вероятно, захотите:
$(this).find( '.BtnSet')
Попробуйте также использовать промежуточные переменные, чтобы вы могли регистрировать/отлаживать свой код. Удивительно, как люди не утруждают себя пониманием происходящего, а потом удивляются, почему они не могут отлаживать или определять, где их код неправильный.
Принцип: если вы не можете зарегистрировать или проверить промежуточный шаг, и есть более одного шага, участвующих в общем поведении, вы не сможете эффективно отладить сбой в общем поведении.
Вы будете уменьшены до крайне неэффективной пробной ошибки, которая обычно терпит неудачу.
Вместо if(('$(this) input:text[name="A[]"]').length){
, попробуйте отладки, например:
var inputsAll = $(this).find( 'input'); // just for learning & debugging
var inputsA = $(this).find( 'input:text[name="A[]"]');
console.log(' found inputs', inputsAll, inputsA);
if (inputsA.length) {
Вы не можете установить $ (this) внутри селектора. Селекторы представляют собой текстовое выражение, вызывающее jQuery для выбора/или обертывания элемента DOM - это вызов функции Javascript. Вы не можете волшебным образом мешать им.
$this
неверно $(this)
изменение
if(('$(this) input:text[name="A[]"]').length){
в
if ($(this).find('input:text[name="A[]"]').length) {
вы код становится
function A() {
var count = 0;
var A = 0;
var C = 0;
$('.JRow').each(function () {
count++;
alert(count);
$(this).find('.BtnSet').each(function () {
A++;
alert(A);
$(this).find('.Child').each(function () {
C++;
alert(C);
if ($(this).find('input:text[name="A[]"]').length) {
alert(('$(this) input:text[name="A[]"]').length);
}
});
});
});
return false;
}
если вы просто хотите подсчитать длину, вы можете использовать
$('.JRow').length;
Рекомендации
http://learn.jquery.com/javascript-101/this-keyword/
Как работает jQuery как прокомментированный undefined
Обновлено после комментария OP
Использовать .has()
$('.JRow').has('.BtnSet');
$('.JRow > .BtnSet').has('.child');
$('.JRow > .BtnSet >.child').has('input:text[name="A[]"]');