Question

好吧，我被困住了。

我正在拼命地从移动设备上的javascript（jQuery）以编程方式专注于文本区域。我做了我的研究，并了解到使用.focus（）键盘的唯一方法是使用click事件。所以我做了一个点击事件。当我点击元素时它会起作用，除了我需要从另一个元素上的触摸屏触发它。很自然地，我在元素上尝试了.trigger（）和.triggerHandler（）。但这些都不起作用。

TLDR;我需要能够从列表中保留一个元素，一段时间后，div将向下滑动textarea并且textarea会获得焦点（使用键盘）。

感谢任何帮助！

这是我的代码：

<div class="quicknote" data-id="0">
    <span>New Note</span>
    <div class="name"></div>
    <textarea class="text"></textarea>
    <div class="toolbar">
        <div class="left cancel">cancel</div>
        <div class="right finish">finish</div>
    </div>
</div>

的jQuery

jQuery(document).ready(function($) {
    var holdThresh = 800;
    $(".row").on("touchstart", function(e) {
    var id = $(this).attr("data-id");
    var name = $(this).html();
    $(this).addClass("down");
    var timer = setTimeout(function() {
        $(".quicknote").attr("data-id", id);
        $(".quicknote .name").html(name);
        $(".quicknote").addClass("open");
        $(".quicknote").trigger("click");
        e.preventDefault();
    }, holdThresh);

    $(this).one("touchend touchmove", function(event) {
        $(this).removeClass("down");
        clearTimeout(timer);
    })

    $(".quicknote .cancel").on("touchstart", function() {
        $(".quicknote").removeClass("open");
    })

    $(".quicknote").click(function(event) {
        $("textarea").focus();
        event.preventDefault();
        event.stopPropogation();
    })
});

Answer 1

我明白了！对于任何发现这个的人来说，这是我更新的jQuery：

$(".row").on("touchstart", function(e) {
    var id = $(this).attr("data-id");
    var name = $(this).html();
    var go = true;
    var focus = false;

    $(this).addClass("down");

    var timer = setTimeout(function() {
        go = false;


        $(".quicknote").attr("data-id", id);
        $(".quicknote .name").html(name);
        $(".note").val("");

        $(".quicknote, .overlay").addClass("open");
        focus = true;

        e.preventDefault();
    }, holdThresh);

    $(this).one("touchmove", function(event) {
        go = false;
        $(this).removeClass("down");
        clearTimeout(timer);
    });

    $(this).one("touchend", function() {
        if (go) window.location = "view.php?id=" + id;
        else {
            if (focus) {
                $(".note").focus();
                focus = false;
            }
            $(this).removeClass("down");
            clearTimeout(timer);
        }
    })
})

我不确定为什么这样可行，但是我没有触发第三个元素的点击然后专注于textarea，而是设置了一个标记＆＃34; var focus＆＃34;，并基于一些条件，能够集中来自touchend事件的textarea。希望这有助于某人！：）

使用jQuery .trigger（）从click事件中将textarea聚焦在移动设备上

1 个答案: