【问题标题】:use same value on 2 inputs on keyup if first one is originaly empty如果第一个输入为空,则在 keyup 上的 2 个输入上使用相同的值
【发布时间】:2015-06-24 13:26:51
【问题描述】:

我在 Name 和 Company 表单中有 2 个字段,我希望 Name 在键入时动态获取 Company 值(仅当您开始输入 Company 时 Name 为空时)并且我没有找到实现的最佳方法这个。

例如,HTML 是:

<form>
    ...
    <input type="text" id="Name" name="Name" value="">
    <input type="text" id="Company" name="Name" value="">
    ...
</form>

我试过了:

$('#Company').on('keyup', function(){
    var str = $('#Company').val();
    str = str.substring(0, str.length - 1);

    if($('#Name').val().length <= 0 || $('#Name').val() == str){
        $('#Name').val($('#Company').val());
    }
});

它在某种程度上有效,如果你输入得太快,它会停止假设 #Name#Company 在上次 keyup 之前具有相同的值

我也想过在公司 blur 上做,它可能会起作用,但这不是我想要实现的用户体验。

这可能会更容易使用 Angular.js 或类似的,但现在使用它不是一个选项。

【问题讨论】:

    标签: javascript jquery dynamic input


    【解决方案1】:

    类似这样,将输入时删除的类添加到名称字段中,否则在从公司字段复制第一个字符后长度检查将失败。

    $('#Name').addClass('empty').on('input', function() {
        $(this).toggleClass('empty', this.value.trim().length === 0);
    });
    
    $('#Company').on('input', function() {
        $('#Name.empty').val(this.value);
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <form>
        Name : <input type="text" id="Name" name="Name" value=""><br>
        Comp : <input type="text" id="Company" name="Name" value="">
    </form>

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-01-02
      • 2021-12-16
      • 2023-01-24
      • 2015-01-29
      • 1970-01-01
      • 2014-07-30
      • 2016-11-16
      • 1970-01-01
      相关资源
      最近更新 更多