Question

我正在处理两个单独的HTML文件;文件一个是主页面，而文件两个包含Kendo-UI弹出式对话框的正文。该弹出窗口在主页面中使用。

在Javascript for file two 中，我尝试引用文件 one 中的HTML元素。它不起作用。

通过一些调试，我设法发现了以下内容：

// In Javascript of file two.
console.log($("#StartPayrollButton"));
// Output in Firefox console:
Object { context: HTMLDocument → CalendarDetails, selector: "#StartPayrollButton" }

以下是我在控制台中手动手动时获得的内容：

// Manually run in the Firefox console.
console.log($("#StartPayrollButton"));
// Output in Firefox console:
Object { 0: <a#StartPayrollButton.btn.btn-large.btn-squared-default.blue>, length: 1, context: HTMLDocument → MA0004, selector: "#StartPayrollButton" }

有人可以向我解释发生了什么事吗？我注意到context在结果上有所不同;第一个结果引用文件两个，而第二个结果引用网页（因此文件一个）。

但是在这种背景下的背景是什么（可怕的双关语意图）？我可以以某种方式更改代码中的上下文（使用jQuery选择器时）吗？

编辑：我去找了对话框的创建方式。这确实是一个iframe：

// Razor in file one.
@(Html.Kendo().Window()
        .Name("PayrollWindow")
        .Title("Start Payroll")
        .Content("Loading payroll options...")
        .LoadContentFrom("CalendarDetails", "Payroll", new { co = Model.Co, guid = Model.calendarId })
        .Draggable()
        .Modal(true)
        .Iframe(true)
        .Visible(false)
        .Width(800)
        .Height(530)
        .Deferred()
    )

Answer 1

上下文基本上是它开始搜索给定选择器的起点，本机JavaScript中的等价物将类似于

.replace(/[^0-9\.,]/g, "")

在jQuery中，您将上下文设置为var context = document.getElementById('parent'); // the context here is "document" var child = context.getElementById('child'); // now the context is the "#parent" element

的第二个参数

$()

意味着jQuery中的相同内容将是

$(selector, context)

当然，这些只是示例，ID必须是唯一的，因此使用ID的上下文并不是必需的，但对于其他类型的选择器，这样做是有意义的，只能选择其他元素中的元素等事实上，jQuery的上下文与

完全相同

$('#child', '#parent')

Answer 2

我最后通过执行以下操作来解决问题：

window.parent.$("#StartPayrollButton");

请注意window.parent允许单独的iframe内的对话框访问主页中的元素。

如何在jQuery选择器中更改上下文

2 个答案: