Jquery .closest 未定义

Question

这是一个更大的应用程序的一部分。
我想做的是在 Jquery 中使用 .closest 提交表单时获取 span1 中的文本。

span1 = $(this).closest("span").html() 的结果未定义。

HTML

<span class="span1">
    texthere
</span>
<div>
    <div class="whatever">
        <form id="theform" action="#" method="POST">
            <input type="text" name="input1" />
        </form>
    </div>
</div>

Jquery

$(document).on("submit","#theform",function(){
    span1 = $(this).closest("span").html();
    input1 = $(this).find("input").val();
    alert(span1+" - "+input1);
    return false;
});

JSFFIDLE

为什么我在读取 .closest .span1 时出现未定义？

Answer 1

.closest() 向上遍历元素的父元素(祖先)，并在第一个与您的选择器匹配的元素处停止。

您的<form>不是 <span> 的 child 标签，所以$(this).closest("span")返回 0 个元素。