вопрос по Javascript

[Vovix]

Дорогие други!

Вот есть интересный ресурс codepen.io
и всё-бы хорошо, можно было-бы использовать, (что я уже и делаю частично) например в Сценах, но...
(я только учусь) можно дурацкий вопрос - зачем Javascript в примера, часто в таком виде?:

Код: Выделить всё

$(function(){
  $('.new').submit(function () {
    // ADD ITEM
    if ( $('#new').val() !== '' ) {
      var item = $('input').val(),
          input = '<input type="text" value="' + item + '" />',
          edit = '<ol><li class="check fa fa-check"></li><li class="delete fa fa-times"></li></ol>';
и т.д. 

т.е. зачем он заключен в $(........) и также внутри например $('#new').val()
Что это - $(...)? И как заставить его (код) работать в поле "Дополнительный Javascript" с сценах?

P.S. Может это что-то типа локализации области выполнения функции?

[sergejey]

Код: Выделить всё

$(function(){
... 

Эта часть позволяет повесить какой-то код, который выполнится по загрузке страницы

$('.new') -- обращение к элементу класса new (например <span class="new">...)

$('#new') -- обращение к элементу с id=new (например <span id="new">...)

$('input') -- обращение ко всем элементам типа input (<input name=".." type=".." value...>)

эта адресация из проекта jquery, который уже подключен, так что на сценах всё должно работать.

[Vovix]

.....
эта адресация из проекта jquery, который уже подключен, так что на сценах всё должно работать.

про jquery я и подумал тоже... просто не использовал еще это!!!

и вот отказывается работать!
например это: To-Do List
переносом HTML, CSS и Javascript в соответствующие части в редакторе сцен
(естественно переносил после нажатия "View Compiled")
???

[Vovix]

помогите!
еще вопрос:
на сцене у элемента создал простой (для проверки) Дополнительный javascript код:

Код: Выделить всё

//дожидаемся полной загрузки страницы
window.onload = function () {

    //получаем идентификатор элемента
    var button = document.getElementById('todo');
    
    //вешаем на него событие
    button.onclick = function() {
        //производим какие-то действия
         alert('проверка');
        //предотвращаем переход по ссылке href
        return false;
    }
    
} 

в Элементе точно есть

Код: Выделить всё

<button id="todo" class="fa fa-plus"></button> 

но нажатия на него ни к чему кроме перезагрузки страницы не приводит!?????

[Vovix]

вообще нужно, что бы заработал такой код javascript:

Код: Выделить всё

//дожидаемся полной загрузки страницы
window.onload = function () {

    //получаем идентификатор элемента
    var button = document.getElementById('todo');
      
    //вешаем на него событие
    button.onclick = function() {
        var task = document.getElementById('new');
        alert (task.value); // это выполняется, а дальше почему-то нет???
        //производим какие-то действия
        if (task.value !== '' ) {
          $.get("/objects/?script=todo_new&task="+task.value, 
                function(data, status){alert("Data: " + data + "\nStatus: " + status);}
               );
       
        //предотвращаем переход по ссылке href
        return false;
        }
    }
    
} 

на такой фрагмент HTML:

Код: Выделить всё

<div id="list">
               <form class="new">
                  <input id="new" placeholder="New Item (max 8)" type="text">
                  <button id="todo" class="fa fa-plus"></button>
               </form><!-- modified -->
               <div class="list">

                     <div class="item" style ="background: rgba(223,30,31,0.9);">
                       <input type="text" value="проснуться" class="checked">
                       <div class="rightblock">
                           <i class="check fa fa-check"></i>
                           <i class="delete fa fa-times"></i>
                       </div>
                    </div>
                </div>
</div> 

но у меня не работает!???
не пойму почему!

[nick7zmail]

Знатоки javascript'а, помогите пожалуйста...
Есть небольшой отрывок кода

Код: Выделить всё

for (var i=1;i<5;i++) {
                if (arr[i] != null ) {
                ymaps.route( arr[i] , {
                    mapStateAutoApply:false
                }).then(function (route) {
                        console.log(i);
                        //alert(route.getHumanJamsTime());
                }, function (error) {
                    alert('Возникла ошибка: ' + error.message);
                });
                }
                } 

Постарался обрезать до минимума...код рабочий...но...в .then(function (route) никак не хочет передаваться параметр i. При выполнении данного кода i в итоге равен 5...на сколько я понял - .then это "отложенное выполнение" функции после выполнения определенных условий. В данном случае .then() выполняется после всех 4х итераций цикла (по-этому и ловлю при выполнении функции в then() i=5), выполняется он тоже 4 раза, с разными результатами на выходе (т.к. route каждый раз разный), отсюда и появилась картина с "постановкой в очередь"... Собственно как внутрь функции передать значение i, в момент постановки в очередь then? Пробовал function (route, i) - все равно не видит.

[olehs]

попробуйте так

Код: Выделить всё

for (var j=1;j<5;j++) {(function(i){
    if (arr[i] != null ) {
        ymaps.route( arr[i] , {
                        mapStateAutoApply:false
                    }).then(function (route) {
                        console.log(i);
                        //alert(route.getHumanJamsTime());
                    }, function (error) {
                        alert('Возникла ошибка: ' + error.message);
                    });
    }
})(j)} 

[olehs]

Проверил в браузере, работает.

А вообще вопросы по JS лучше сразу закидывать в песочницу, например на jsfiddle.net.

[nick7zmail]

Проверил в браузере, работает.

Спасибо помогло...действительно работает...но сейчас я не понимаю как оно работает =D...если в цикле j меняется от 0 до 5, то как меняется i? там не i++ не i=j нигде нету, даже объявления переменной i нигде нет...как? =DD

[olehs]

i - это параметр анонимной функции, которая создается и сразу же вызывается с параметром j (в конце)