试图设置动态添加输入的焦点

时间:2016-12-09 22:20:29

标签: javascript jquery

我有时间让这个输入集中注意力。它是动态加载的。在输入模糊时,应该进行一些检查,如果输入了错误的id,则返回到该输入。 $(itemID)是我想要关注的。

这是我在页面加载时调用的javascript函数。

    for (var i = 0; i < bricks.length; i++) {
        var b = bricks[i];
        if (AABBIntersect(this.x, this.y, this.width, this.height, b.x, b.y, b.w, b.h)) {
            bricks.splice(i, 1);
            i--;
        }
    }

这是动态添加的表:

function addBlurEvent() {
            $("#brochureItems").on("blur", ".item-ID", (function (e) {
                var itemID = $(this);
                var itemIDVal = $.trim($(this).val());               

                if (itemIDVal != "") {
                    var item = "";
                    $.each(window.listOfItems, function(i, v) {
                        if (v.No.search(itemIDVal) != -1) {
                            item = v.Description;
                            return;
                        }
                    });
                    if(item != "") {
                        $(itemID).parent().parent().siblings(".item-desc").find("input").first().val(item);
                        $(itemID).parent().siblings(":last").find("input").first().focus();
                    } else {
                        slideDownMsg("Item: " + itemIDVal + " not found.");
                        slideUpMsg(3000);
                        $(itemID).focus();
                    }

                } else {
                    $(itemID).parent().siblings(".item-desc").find("input").first().val("");
                    $(itemID).parent().siblings(":last").find("input").val("")
                }
            }));
            $(".removeRow").on('click', function() {
                $(this).closest("tr").remove();
            });
        }

我只能在检查员身上看到。源代码显示了表应该去的空div。

我认为这不重要,但是在ajax调用的成功中调用了addBlurEvent函数。这是第一个被调用的函数:

<table class="table table-bordered table-striped" id="brochureItems">
<thead>
    <tr>
        <th>
            Item Code
        </th>
        <th>
            Brochure Code
        </th>
        <th width="35%">
            Item Description
        </th>
        <th>
            Retail
        </th>
        <th>
            Remove
        </th>
    </tr>
</thead>
<tbody>

    <tr>
        <td class="row">
            <div class="col-md-8">
                <input id="brochureItems_0__itemNo" class="form-control text-box single-line valid item-ID" data-val="true" data-val-required="The Item Code field is required." name="brochureItems[0].itemNo" aria-invalid="false" type="text">
            </div>
        </td>
        <td class="row">
            <div class="col-md-8">
                <input id="brochureItems_0__brocCode" class="form-control text-box single-line" data-val="true" data-val-required="The Brochure Code field is required." name="brochureItems[0].brocCode" type="text">
            </div>
        </td>
        <td class="row item-desc">
            <div class="col-md-12">
                <input id="brochureItems_0__itemDesc" class="form-control text-box single-line" data-val="true" data-val-required="The Item Description field is required." name="brochureItems[0].itemDesc" readonly="readonly" tabindex="-1" onfocus="this.blur()" type="text">
            </div>
        </td>
        <td class="row">
            <div class="col-md-8">
                <input id="brochureItems_0__retail" class="form-control text-box single-line" data-val="true" data-val-number="The field Retail must be a number." data-val-required="The Retail field is required." name="brochureItems[0].retail" type="text">
            </div>
        </td>
        <td class="remove"><span class="glyphicon glyphicon-remove removeRow"></span></td>
    </tr>
</tbody>

2 个答案:

答案 0 :(得分:1)

终于明白了。我认为必须有办法,因为我在该功能中的其他事件正在发挥作用,而不是焦点事件。结束了发现这个SO Q&amp; A解决了我的问题:jquery focus back to the same input field on error not working on all browsers

基本上,我必须在焦点上设置超时。所以这是代码:

setTimeout(function() { itemID.focus(); }, 50);

答案 1 :(得分:0)

删除功能周围的 Option Explicit Sub Button4_Click() Dim x As Long Dim erow As Long Dim y as Long Dim roww as Long Dim matchess as Integer Dim IDitem as Integer Dim myrange as Long 'Calculate starting rows x = 15 With Worksheets("sheet2") erow = .Cells(.Rows.Count, 1).End(xlUp).Offset(1, 0).Row End With myrange = Worksheets("sheet1").Cells.Range("C:I") With Worksheets("sheet3") Do While .Cells(x, 1) <> "" 'The next line copies values to Sheet2 Worksheets("sheet2").Range("A" & erow & ":Z" & erow).Value = .Range("A" & x & ":Z" & x).Value 'increment row counters x = x + 1 erow = erow + 1 Loop End With y = 15 With Worksheets("sheet1") Do While Worksheets("sheet3").Cells(y, 1) <> "" matchess = Worksheets("sheet3").Cells(y, 1) IDitem = Application.WorksheetFunction.VLookup(matchess, myrange, 4, False) roww = Application.Match(matches, myrange, 0) .cell(roww, 7).Value = .cell(roww, 7).Value - IDitem y = y + 1 Loop End With End Sub

()我做出假设的问题

有些代码没用,我对它进行了评论。 某些代码在您的示例中“不存在”,因此我注释掉了对此的引用。

我做了一些假设,你想把“单元格”聚焦在“td”引用的siblings类的同一个TD行中。

.row

参考小提琴:https://jsfiddle.net/xL8wh3qo/

请参阅此更新的小提琴,其中显示了如何保存表格行,克隆它然后允许您从表中添加新行的示例。即使删除了所有行,也可以从保存的克隆中添加一个新行,并根据原始行添加正确的ID:https://jsfiddle.net/DTcHh/27778/