1

以下に示す関数を呼び出している textfiedl がありますが、問題は、入力では機能しているがキーアップでは機能していないか、テキストフィールドの値が変更されたときにこのメソッドを呼び出したいことです。

Javascript:

$(function() {

    var input = $('.input'),
        bar = $('.bar'),
        bw = bar.width(),
        percent = bar.find('.percent'),
        ps = percent.find('span');

    input.on('keydown', function(e) {
        if (e.keyCode == 13) {
            var t = $(this),
                val = t.val();
            if (val >= 0 && val <= 100) {
                var w = 100 - val,
                    pw = (bw * w) / 100,
                    pa = {
                        height: w + '%'
                    },
                    cw = (bw - pw) / 2,
                    ca = {
                        left: cw
                    }
                ps.animate(pa);
                cs.text(val + '%');
                circle.animate(ca, function () {
                    circle.removeClass(name)
                }).addClass(name);
            } else {
                alert('range: 0 - 100');
                t.val('');
            }
        }
    });

});

HTML:

<div class="text">
    <input type="text" class="input" value="0" id="sliderValue170h" />
</div>
4

5 に答える 5

2

キーダウンと変更の両方で機能する関数に変更を追加するだけです。

$(関数() {

var input = $('.input'),
    bar = $('.bar'),
    bw = bar.width(),
    percent = bar.find('.percent'),
    ps = percent.find('span');

input.on('keydown change', function(e) { // in here it works for both keydown and change
    if (e.keyCode == 13) {
        var t = $(this),
            val = t.val();
        if (val >= 0 && val <= 100) {
            var w = 100 - val,
                pw = (bw * w) / 100,
                pa = {
                    height: w + '%'
                },
                cw = (bw - pw) / 2,
                ca = {
                    left: cw
                }
            ps.animate(pa);
            cs.text(val + '%');
            circle.animate(ca, function () {
                circle.removeClass(name)
            }).addClass(name);
        } else {
            alert('range: 0 - 100');
            t.val('');
        }
    }
});
于 2013-04-04T07:22:19.690 に答える
0 
$('#sliderValue170h').change(function(){
{
  //your code here
});
于 2013-04-04T07:17:18.687 に答える
0

keyupの代わりに使用keydown

 input.on('keyup', function(e) {
   ....
于 2013-04-04T07:20:26.110 に答える
0

次のように onkeypress イベントを使用できます。

HTML

   <div class="text">
   <input type="text" class="input"  value="0" onkeypress="return runScript(event)"   id="sliderValue170h"/>
   </div>

Javascript

 function runScript(e)
 {
     //Set Your logic
      if (e.keyCode == 13) {

      }
 }
于 2013-04-04T07:22:29.780 に答える
0 
$('#sliderValue170h').bind('change keyup',function(){

var t = $(this),
            val = t.val();
        if (val >= 0 && val <= 100) {
            var w = 100 - val,
                pw = (bw * w) / 100,
                pa = {
                    height: w + '%'
                },
                cw = (bw - pw) / 2,
                ca = {
                    left: cw
                }
            ps.animate(pa);
            cs.text(val + '%');
            circle.animate(ca, function () {
                circle.removeClass(name)
            }).addClass(name);
        } else {
            alert('range: 0 - 100');
            t.val('');
        }
});
于 2013-04-04T07:32:40.297 に答える