输入键在输入字段上不执行任何操作

debugcn 发表于 Dev

皇家爸爸

我在滑块下面有一个输入，其中显示了滑块的值。移动滑块后，输入将显示货币格式的数字。我还允许用户输入图形，并且滑块会相应地进行调整。

除enter按键之外，所有其他功能都无法正常使用，无法激活手动字段更改。

以下HTML显示了位于这样的滑块下的输入：

<table class="transaction-calculations">
    <tbody>
        <tr>
            <td class="invoice-slider invoice">
                <input type="range" name="avg_tran_slider" class="wpcf7-form-control wpcf7-range form-control" id="avg_tran_slider" min="0" max="50000" value="150"><br/>
            </td>
        </tr>
        <tr>
            <td class="invoice-slider">
                <input type="text" id="avg_tran" class="slider-calculator-figure" value="$150.00"/>
            </td>
        </tr>
    </tbody>
</table>

我用JS这样格式化它的内容：

/** select input contents when activated **/
jQuery("#avg_tran").focus(function() {
    jQuery(this).select();
});

/** set slider position from manually entered value **/
jQuery("#avg_tran").blur(function() {

    monthly_invoice_value = jQuery(this).val();
    monthly_invoice_value = parseFloat(monthly_invoice_value.replace(/[^0-9-.]/g, ''));

    if(isNaN(monthly_invoice_value)) {
        jQuery("#avg_tran").val("$0.00");
        jQuery("#avg_tran_slider").val(0);
    } else {

        if(monthly_invoice_value > 50000) {
            jQuery("#avg_tran").val("$50,000.00");
            jQuery("#avg_tran_slider").val(50000);          
        } else {
            jQuery("#avg_tran").val(formatMoney(monthly_invoice_value));
            jQuery("#avg_tran_slider").val(monthly_invoice_value);
        }
        calculateCosts();
    }
});

/** set input value from slider change **/
jQuery("#avg_tran_slider").on("change mousemove", function() {
    monthly_invoice_value = jQuery(this).val();
    jQuery("#avg_tran").val(formatMoney(monthly_invoice_value));
    calculateCosts();
});

除了enter手动更改字段值时无法击中之外，其他所有功能都可以正常运行，因为它不会“散焦”字段并激活blur代码。

我想念的是什么（现在除了弹珠了！）。谢谢！

魔术师

enter如果要执行一些代码，则可以在输入中监听键。

jQuery("#avg_tran").keypress(function(event) {
    var code = event.keyCode || event.which;

    // 13 = key code of enter
    if (code == 13) {
        // Do something. Probably trigger the blur event in your case
        jQuery("#avg_tran").blur();
    }
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。