Незначительный Javascript Puzzle

Question

В этом кусочке javascript идея состоит в том, чтобы считать вперед, когда кто-то щелкает, пока не достигнет «5»;затем он должен вернуться назад.

count=0;
function remote(w) {
    count++;
    if (count < 5 ) {
        for (var i=1;i<=5;i++) {
            var g = document.getElementById("searchme").value = w+count;
        }
    }else if (count > 4) { 
        for (var i=5;i > 0;i--) {
            //alert(i);
            var q = document.getElementById("searchme").value = w+count;
        }
    }
}

Однако он работает только при наличии предупреждения.Как вы получаете значение «я» в форме, или около того?

О, спасибо за ваш быстрый ответ, все.Это побудило меня выработать что-то:

var f = 0;
var s = 0;
function upDown() {
    if (s < 5 && f==0){
        countUp('no.');
        if (s==5){f=1}
    }else if(s > 0 && f==1){
        countDown('no.');
        if (s==0){f=0}
    }
}

function countUp(w) {
    s++;
    var el = document.getElementById('box03').innerHTML = w+s;
}

function countDown(w) {
    s--;
    var el= document.getElementById('box03').innerHTML = w+s;
}

Answer 1

Весь JavaScript (кроме веб-работников) в Интернете является синхронным - пока ваш JS работает, браузер больше ничего не может сделать, включая рисование.Причина, по которой вы видите обновление, когда появляется диалоговое окно с предупреждением, заключается в том, что различные механизмы в браузере, которые заставляют его работать, также требуют от них перекрасить главное окно., 3 .. и т. Д. Вам нужно будет использовать тайм-аут.

Answer 2

Одним из самых простых решений было бы использование innerHTML, как в реализации, так и в логике:

JS

document.getElementById('logs').innerHTML+='Hello ';
document.getElementById('logs').innerHTML+='World ';
document.getElementById('logs').innerHTML+='!';

HTML

<div id="logs"></div>

ОБНОВЛЕНИЕ

Взяв код, который вы прокомментировали для моего поста, и немного его обновив:

var max = 5;
var min = 0;
var cur = 0;
var dir = 1;

function pingPong() {
    cur+=dir;
    document.getElementById('box').innerHTML='No.'+cur;
    if(cur==max){dir=-1;return;}// ping
    if(cur==min){dir=1;return;}// pong
}
window.onclick=pingPong;

Пример на jsfiddle

Answer 3

Вы можете указать переменную на элемент документа, который вы хотите обновить (например, searchme), а затем назначить значение этого объекта.

Если объект является элементом формы (входной), то вы можетеиспользуйте параметр .value.Если объект является элементом div / span или каким-либо другим элементом HTML, вам нужно изменить значение .innerHTML

//For DIV/SPAN etc:
var el=document.getElementById("divx");
el.innerHTML=i;

//For INPUT
var el=document.getElementById('inputx');
el.value=i;

ПРИМЕЧАНИЕ. Без задержек элемент будет отображаться как содержащий только последнее значение (потому что он будет обновляться слишком быстро, чтобы вы могли наблюдать)