Search jQuery

jQuery Forum

How to set global variable between two html number inputs

in Using jQuery • 8 years ago

Hello, my first post...
I am trying to use two different html number input boxes to set a global variable that runs an endless looping number counter. The first input works fine but the second one loses focus after it's clicked? (I'm new at this really)
What I want is to be able to change the variable by clicking either of the number inputs. If I want one of the numbers running, I just click it or change the value. If I want the other value, just click it to change, or change the value.
It seems impossible to get the variable to change.
I don't have to do anything to the first input because it it actve, just change the value and restart the counter.
I have tried everything under the sun and cannot get the second input to set the variable.
Thanks for any suggestions. I am very new at this.

<script>
function changeval() {

    start_counter();
    }


    function updateInput() {

    start_counter();
    }
</script>
<html>
<input type="number" onmouseup="updateInput()" NAME="target" size="2" class="btn2" min="" id="input2" style="font-family:roman; width: 55px;" value="20" >
<input type="number" class="btn2" id="speed" NAME="target" size="2" min="0" style="font-family:roman; width: 55px;" value="25" onclick="function changeval() ">
</html>

Replies(4)

kbwood.au

Re: How to set global variable between two html number inputs

8 years ago

There isn't any jQuery here - this is a jQuery forum.

You haven't shown what start_counter does so we can't help you anyway.

Craig Sto..

Re: How to set global variable between two html number inputs

8 years ago

I just showed what I thought was relevant code. I've got a mix of js and jquery and wanted to do this with jquery.

<script type="text/javascript">

$(document).ready(function(){

    $(' #saver').append('<div id="header2">psychiclotto.org</div>');


});

var p = 1;
var t;
var c = 0;
var i = 1;
var s = 0;
var a = 0;
var input = 0 ;
var nums=[];
var input = document.getElementById('input').value
var input2 = document.getElementById('input2').value

function start_counter() {

nums=[];
if(t){clearTimeout(t);}
document.getElementById('numbers').innerHTML="";
c=0;
var input = Number(document.getElementById('input').value);
for(var x = p; x<input+1; x++){
nums.push(x)
    }
loop();

}

function loop() { //looping counter
s = document.getElementById('speed').value;
    if (i <= 10) {
        document.getElementById('looper').innerHTML = nums[c++%nums.length]; //displays the looping numbers in div looper
        t = setTimeout(loop, s);
        }
    }

    function display_number(){ //display a number from looping counter onclick
    if(nums.length==0){return;}
        clearTimeout(t);

        var thenum=document.getElementById('looper').innerHTML;
            document.getElementById('numbers').innerHTML += thenum+ " "; //numbers div where picked number is displayed
            for(var j = 0; j<nums.length; j++){
            if(thenum==nums[j]){
            nums.splice(j,1)
            }
        }
        if (nums.length>1){
        loop();
        } else {
        document.getElementById('numbers').innerHTML +=nums.pop();
        document.getElementById('looper').innerHTML="";
        s = document.getElementById('speed').value ;
            }
        }
    function set_zero() {
        document.getElementById('starter').value = '0';
        }

    function set_one() {
        document.getElementById('starter').value = '1';
        }


    function changeval() {

    start_counter();
    }


    function updateInput() {

    start_counter();
    }



    function clear_board() {         //This function starts the magic
    var dd= document.getElementById('input').value;
        if (dd<2){alert('Enter a number greater than one')}
        else {


    $('#footer').hide();
    $('#block').hide();
    $('#right').hide();
    $('#cwords').hide();
    $('#moon').hide();
    $('#magic').css('background-image', 'url(purpblur.png)');
    start_counter();
    $('body').css('background-image', 'url(purpgrad.png)');
    $('#header').css('background-image', 'url(nighttimegrad.png)');
    $('#looper').show(2000);
    $('#numbers').show(2000);
    $('#saved').show(2000);

    $('#megabox').show(2000);
    document.getElementById('numbers').innerHTML = '';

    document.getElementById('numbers').style.minHeight = '75px';

    a = 0 ;
}}

    function add() {             //This function creates a html line break
        var br = document.createElement("br");//Create an input type dynamically.
        var foo = document.getElementById("saver");
        foo.appendChild(br);
}

    function save_num() {         //This function saves numbers to corner box on site div "saver"
        var pn= document.getElementById('numbers').innerHTML;
        if (pn==''){'focus(input)';}
        else {
        $('#saver').append($('#numbers').html());
        add();
        $('#saver').show(2000);
        $('#buttonholder').show(2000);
        start_counter();
        }}

    function clear_box() {          //This function closes the box that temp holds picked nums
    $('#buttonholder').hide(2000);
    document.getElementById("saver").innerHTML = '';
    $("#input").focus();
    $(' #saver').append('<div id="header2">psychiclotto.org</header2><br>');

}


    function reset_counter() {
        clearTimeout(t);
        c = 1;
        i = 1;
        a = 0;
        p = 1;
        $('#megabox').hide();
        $('#footer').show();
        $('#numbers').hide();
        $('#looper').hide();
        $('#header').css('background-image', '');
        document.body.style.background = "#000000";
        document.getElementById('looper').innerHTML = '';
        document.getElementById('numbers').innerHTML = '';
        document.getElementById('input').value = '';

        document.getElementById('numbers').style.minHeight = '0px';
        $('#magic').css('background-image', '');
        $('#block').show();
        $('#right').show();
        $('#cwords').show();
        $('#moon').show();
        $('#saved').hide();
        nums.length = 0;
}


    function printDiv() {          //Prints lotto numbers

       var divContents = $("#saver").html();
         var printWindow = window.open('', '', 'height=500,width=410,scrollbars=yes');
         printWindow.document.write('<html><head><title>Title of Print Page</title>');
          printWindow.document.write('<link href="style1.css" rel=\"stylesheet\" type=\"text/css\" />');
         printWindow.document.write('</head><body >');
         printWindow.document.write(divContents);
         printWindow.document.close();
         printWindow.print();

}





var _gaq = _gaq || []; //google analytics
_gaq.push(['_setAccount', 'UA-31827437-1']);
_gaq.push(['_trackPageview']);

(function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>

kbwood.au

Re: How to set global variable between two html number inputs

8 years ago

I'm no wiser as to what you're trying to achieve. You trigger start_counter when #input2 or #speed change but are reading a value from #input , creating an array of numbers, and then looping over something involving global variables.

Can you create a minimal page that shows the problem in JSFiddle and explain what you actually want to happen?

Craig Sto..

Re: How to set global variable between two html number inputs

8 years ago

You can see it here.
I rigged the code to run the entire number picker code inside the function.
I would much rather change the variable than have a truckload of code to load.
http'//www.psychiclotto.org

Top Reply

Response title

Attachments

jQuery Forum

How to set global variable between two html number inputs

Replies(4)

Re: How to set global variable between two html number inputs

Re: How to set global variable between two html number inputs

Re: How to set global variable between two html number inputs

Re: How to set global variable between two html number inputs

Statistics

Tags

Actions