0

我有一个简单的十进制到二进制转换器。

它工作起来很简单,你在文本框中写下你的十进制数字,然后点击按钮来获得你的结果,但我希望它是自动的,所以你不必每次都点击提交按钮,并自动刷新。我的代码是:

<div id="Conv" style="font:24px bold; display: none">
Decimaal naar binair.<br>
    <input type="text" id="txtDec" maxlength="3"/>
    <input type="button" value="Convert" onclick="document.getElementById('Converter2').innerHTML=ConvertToBinary(document.getElementById('txtDec').value);" />
    <span id="Converter2"></span>
</div>

这是javascript部分:

function ConvertToBinary(dec) {
    var bits = [];
    var dividend = dec;
    var remainder = 0;
    while (dividend >= 2) {
        remainder = dividend % 2;
        bits.push(remainder);
        dividend = (dividend - remainder) / 2;
    }
    bits.push(dividend);
    bits.reverse();

    return String('000000000' + bits.join("")).slice(-8);


}
4

5 回答 5

0

我认为如果这项任务仅用于学习 javascript,建议的选项就足够了。否则,让我添加一些一般性注释。如果您正在使用标准表单元素,例如输入和文本区域,您可以在鼠标的帮助下插入文本(我的意思是右键单击 -> 粘贴)。这样,仅处理 keyup 是不够的。通过监听 mouseup 来处理每一次鼠标点击也不是一个好主意。以编程方式更改字段怎么样?

我相信最好的方法是处理 onchange 事件,每次您更改内部值并且元素将“不集中”时都会触发该事件。

于 2013-10-23T22:03:06.250 回答
0

使用 .keyup() 并在用户完成输入后更改值(也就是按回车键)

$('#txtDec').keyup(function(event) {
     if (event.keyCode == 13){
        var converted = ConvertToBinary(this.value);
        $('span#Converter2').text(converted);
     }
 });
于 2013-10-23T21:48:56.297 回答
0

在现代浏览器中,您可以使用oninput事件,每次input更改内容时都会触发该事件。在较旧的浏览器(实际上是 IE<9)中,您可以使用onchange事件,但在这种情况下,您需要input在事件触发之前模糊。(仅在 IE 中,有onpropertychange可用的事件,它也可以处理以编程方式对元素进行的更改。)

在下面的代码片段中,我重写了您的ConvertToBinary()函数,只是为了展示另一种转换数字基数的方法。Number.toString()可用于将十进制数转换为 2 到 36 之间的任何基数,parseInt()并可用于将表示基于 2 到 36 之间的数字的字符串转换为小数。

document.getElementById('txtDec').addEventListener('input', function () {
    var bin = parseInt(this.value, 10).toString(2),
        digits = ''; 
    if (!isNaN(bin) && bin.length < 9) {
        digits = new Array(9 - bin.length).join('0') + bin;
    }
    document.getElementById('Converter2').innerHTML = digits;
});

jsFiddle 的现场演示

ConvertToBinary()当然,您可以在传递给的匿名函数中使用您的原始函数addEventListener(),或者您可以只传递它的名称:

document.getElementById('txtDec').addEventListener('input', ConvertToBinary);
于 2013-10-24T08:43:04.577 回答
0

您可以运行代码onkeyup

<input type="text" id="txtDec" maxlength="3" onkeyup="convert(this)" />

function convert(el) {
    document.getElementById('Converter2').innerHTML=ConvertToBinary(el.value);
}
于 2013-10-23T21:03:46.727 回答
0

.keyup()在文本框的事件中处理转换

$('#txtDec').keyup(function(e) {
    var converted = ConvertToBinary(this.value);
    $('span#Converter2').text(converted);
});
于 2013-10-23T21:04:04.070 回答