Как зациклить элементы и заменить одновременно в jQuery - PullRequest
0 голосов
/ 22 июня 2011

Я пытаюсь перебрать дочерние элементы body и заменить body на дочерний HTML. У меня пока есть этот код.

 <script type="text/javascript">
      $(document).ready(function(){
        $(':submit').click(function() {
         var children = $('body').children();
         var arChildren = $.makeArray(children);
         for (var i = 0; i < arChildren.length; i++) {
           var htmlText = arChildren[i].innerHTML();
           $('body').replaceWith(htmlText);
         }
        });
      });
    </script>

Не могли бы вы посоветовать мне, что я делаю не так?

уточнение: при первом нажатии на кнопку <body> будет заменено первым дочерним элементом, при втором щелчке тело будет заменено вторым дочерним (но исходным) ... затем третьим ... Наконец, кнопка может быть неактивной. Но кнопка не должна исчезать (она тоже под телом).

спасибо

Ответы [ 5 ]

3 голосов
/ 22 июня 2011

Используйте функцию $ .each.

var new_html = '';
$('body').children().each(function(i, ele){
  new_html += $(this).html();
});
$('body').html(new_html);
1 голос
/ 22 июня 2011

РЕДАКТИРОВАТЬ: Посмотрите на последний jsfiddle, это, вероятно, то, что вы собирались. Другие были моим путем в достижении этого.

http://jsfiddle.net/tDkMV/1/

Это должно сделать это для вас. Прямая замена содержимого тела не сработает для вас, потому что тогда вы удалите свою кнопку, дочерние элементы и т. Д.

$(function(){
    $('input[type=submit]').click(function(){
        domObj = $('.replaceableChildren');
        // This line really does two things.
        // It removes the first child from the objects you're looking for,
        // and then takes that removed object and puts it as the html for the 'body'
        // (which is a div with class='content')
        $('.content').html(domObj.children(':first').remove());
        // Disables the button if there's no children left to remove.
        if(domObj.children().length <= 0){
            $(this).prop('disabled', true);
        }
    });
});

Если вы хотите, чтобы все началось видимым, то уходите, иди с чем-то вроде этого:

http://jsfiddle.net/tDkMV/2

Если вы действительно намерены заменить все в теле, вы можете попробовать это:

http://jsfiddle.net/tDkMV/4/

Для этого может потребоваться, чтобы вы «сфокусировались» на окне результатов, поэтому щелкните там, а затем нажмите любую клавишу на клавиатуре. Существуют проверки кодов клавиш, которые можно выполнить, чтобы проверить, нажата ли клавиша «Ввод» или что-то в этом роде.

Гм, и вот я каждый раз пытаюсь включить кнопку отправки: p Я думаю, это именно то, что вы искали (замените тело и удерживайте кнопку отправки).

http://jsfiddle.net/tDkMV/5/

0 голосов
/ 22 июня 2011

Я бы проголосовал за ответ Райана, поскольку он оба дал вам правильный синтаксис jquery для «зацикливания» (на самом деле это не цикл, который является частью красоты jquery) и интуитивно понял, что вы хотели сделать, я полагаю -если только вы действительно не хотите использовать HTML-код последнего дочернего элемента.Поскольку вы также спросили, что вы делаете неправильно, некоторые вещи, на которые следует обратить внимание в отношении его краткой коррекции, могут включать:

Использование «this» вместо создания переменной-заполнителя с запутанным (и, возможно, зарезервированным?) Именем »дети."«это» содержит ценность каждого ребенка.

Использование + =.Вместо того, чтобы перезаписывать каждую итерацию, это позволяет вам захватить каждое значение и добавить его в свою кучу значений (что вы храните в new_html).

0 голосов
/ 22 июня 2011

Хотя я не понимаю, что вы пытаетесь достичь с помощью приведенного выше кода, чтобы внести в него синтаксически правильное изменение:

var htmlText = arChildren[i].innerHTML();

до

var htmlText = arChildren[i].innerHTML;
0 голосов
/ 22 июня 2011

В цикле for вы заменяете тело при каждой итерации, поэтому оно всегда будет содержать HTML из последнего дочернего элемента. Попробуйте это:

script type="text/javascript">
      $(document).ready(function(){
        $(':submit').click(function() {
         var children = $('body').children();
         var arChildren = $.makeArray(children);
         var htmlText='';
         for (var i = 0; i < arChildren.length; i++) {
           htmlText += arChildren[i].innerHTML;
         }
         $('body').replaceWith(htmlText);
        });
      });
    </script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...