相关疑难解决方法(0)
执行ajax响应中返回的js文件
我有一个使用jquery 3.2.1的HTML5应用程序.
在应用程序的一部分 - 搜索功能 - 我发出ajax请求.来自ajax请求的响应是HTML,这包括一个<script>链接到js文件的标记,该文件与应用程序位于同一服务器上.
所以ajax代码看起来像这样 - 用于发出ajax请求并将响应写入具有ID的div #ajaxContent:
$.ajax({
url: $('#searchRegulations').attr('action'),
type: 'post',
cache: false,
data: $('#searchRegulations').serialize()
}).done(function (response, status, xhr) {
if (response) {
$('main .content').hide();
$('#ajaxContent').html(response).show();
return false;
}
}
});
如果我检查#ajaxContent我可以看到<script>标签包含在ajax响应中:
我还检查了我的网络选项卡,以确保/js/search_regulations.js正确加载,它给出了200响应:
里面search_regulations.js有一些jquery切换存在的一些过滤器#ajaxContent.
问题是这个代码似乎只在50%的时间内起作用.当它工作时,它将切换一些过滤器按钮的状态,方法是
.active在内部的元素中 添加/删除一个类.browse-ctp__filters-data,然后将它们写入带有ID的隐藏表单#tmpFilters.
为了确保脚本"触发",我放入了该行,console.log('search_regulations.js firing');并确定每次都会在控制台中显示,无论脚本是否起作用.
更奇怪的是,如果在将ajax响应写入页面后将代码剪切/粘贴到我的控制台中,它总是按预期工作.
这是脚本进入页面的方式有问题吗？
我已粘贴下面的脚本,但我不认为这是代码中的代码问题,而是处理浏览器/ ajax响应的方式:
$(function() {
console.log('search_regulations.js firing');
/* toggle the active …推荐指数
解决办法
查看次数
确定HTML元素位置更改
编辑:看更新!
我有以下html:
<body>
<span id="milestone1">
</span>
<img id="image1" src="blabla.jpeg" style="width:400px;height:200px;" />
<div id="divOverlayOverImage1" style="position:absolute; top:100px; left:40px; width:400px;height:200px;" onclick="DoFunkyStuff();"><div>
</body>
首先将divOverlayOverImage1它放在上面Image1,覆盖它,但如果我运行下面的代码,#divOverlayOverImage1元素将不再覆盖#image1元素.
$("#milestone1").after('<div style="width:500px; height:500px; background-color:blue;">');
我希望有一个事件在#image1更改其位置时通知我,所以我可以更新其位置#divOverlayOverImage1.
注意:我没有完全控制dom.该$("#milestone1").after('<div style="width:500px; height:500px; background-color:blue;">');命令由第三方运行.
更新:我没有完全控制DOM,所以我不能把回调添加到元素添加功能,因为这不是我打电话.另外,我不能像疯了一样修改HTML.我只是来到一组网站,通过JavaScript追加并覆盖到特定的图像,就是这样.还有其他竞争对手也会改变HTML.
推荐指数
解决办法
查看次数
如何在运行脚本之前检查页面上是否已加载元素？
所以我在我的公司模板中创建我的页面,这只允许我们访问页面正文.我们无法访问head标记,并且在页面的下半部分加载了我们无权访问的脚本.其中一个脚本动态地将元素加载到页面上.我需要在该元素上运行另一个脚本,但因为直到我的脚本已经运行之后才在页面上加载该元素,所以我无法访问该元素.有没有办法在运行脚本之前检查是否已在页面上加载该元素？
如果我需要更好地解释,请告诉我.
<head>Don't have access</head>
<body>
<!--Needs to manipulate the element created by the companyScript.js-->
<script src="myScript.js"></script>
<!--Script that runs after mine, which I don't have access too-->
<script src="companyScript.js">
/*Dynamically adds <div class="element"></div> to page*/
</script>
</body>
推荐指数
解决办法
查看次数
使用JavaScript进行HTMLCollection更改事件
如果我假设正确,HTMLCollection是动态的.
在文档中添加或删除自动更改的项目.
有没有办法使用事件处理程序检测HTMLCollection大小的变化？除了使用计时器不断轮询收集当然.
推荐指数
解决办法
查看次数
在页面加载和随后的ajax回发时注册jquery
使用应该在首页加载和随后的Ajax回发时注册的JQuery.应用此控件的控件是在更新面板内部.现在我在做什么
以同样的方式注册相同的功能document.ready,sys.application.add.load因此它适用于更新面板和控制中的控件,这些控件位于更新面板之外.
$(document).ready(function () {
CheckMaxlength();
//If Text area is placed inside update panel then apply restriction for texarea size.
Sys.Application.add_load(function () {
CheckMaxlength();
});
});
我想知道使用更新面板和外部更新面板内的控件的确切方法是什么
推荐指数
解决办法
查看次数
如何检查Google Recaptcha V2 Puzzle是否显示？
当 Recaptcha 显示谜题而不是复选框时，我尝试调整容器 div 的大小。这通常发生在单击复选框后。我怎样才能做到这一点？
我知道在某些条件下会强制 Recaptcha V2 显示谜题而不是复选框。然而，API 不会返回表明此更改已发生的属性或事件。有没有一种方法可以通过 JavaScript 或 API 来识别 Recaptcha V2 是否正在显示拼图？
注意：这是在我没有在 API url 中指定 Fallback=true 的情况下发生的。
推荐指数
解决办法
查看次数
jQuery:使用IE10中的MutationObserver检测div内容是否已更改
我正在使用"MutationObserver"来检测内容是否在div中发生变化.
它在Firefox,Safari,Chrome,IE11等中运行良好,但我无法在IE10中使用它.
A进行了搜索,看起来IE10不支持"MutationObserver",但您可以使用以下"PolyFill"使其正常工作:https://github.com/googlearchive/MutationObservers/blob/master/MutationObserver.js
我试过了,但它还没有用.
我是否正确加载MutationObserver.js修复程序？或者有没有人知道更好的方法来检测IE10中的div内容是否发生变化？
JSFiddle:https://jsfiddle.net/hvt217dm/
代码在这里:
"use strict";
// Change content
$(".button1").click(function() {
$(".content1").html("Test 2");
});
// Check if content has changed
var target = document.querySelector(".content1");
var observer = new MutationObserver(function(mutations) {
alert("Changed");
});
var config = { attributes: true, childList: true, characterData: true };
observer.observe(target, config);
推荐指数
解决办法
查看次数
如何用柏树中的夹具模拟图像
我正在使用 cypress 来测试我的 VueJS 应用程序。我遇到的一件事是模拟要显示在页面上的图像。对于我的用例，我只是使用以下代码加载用户配置文件：
describe('Test Login', () => {
it('Can Login', () => {
cy.server();
cy.route({
method: 'GET',
url: '/api/account/',
response: 'fx:profile.json',
});
cy.route('**/media/demo1.png', 'fx:demo1.png');
});
});
fixtures/profile.json
{
"avatar": "http://localhost:8080/media/demo1.png",
"username": "cypress",
"email": "email@cypress.io",
"pk": 1,
"is_staff": true,
"is_superuser": true,
"is_active": true
}
配置文件夹具数据在测试中正确加载。在我的 fixtures 文件夹中，我还有一个demo1.png文件。我希望在测试期间加载此图像并显示在页面上，但它显示为损坏的图像。
在网络选项卡中，它显示demo1.png为带有 200 响应代码和text/html.
cypress 文档主要在上传图像的上下文中讨论图像，但我一直无法找到如何模拟通过<img>标签加载的图像的示例。有没有更简单的方法来做到这一点？
推荐指数
解决办法
查看次数
高效检测单页面应用中的 DOM 变化
我正在构建一个 JS 库，其中一个用例要求我触发 DOM 更改事件，特别是如果它是单页应用程序，例如： github 搜索栏
经过一些研究后我发现MutationObserver：
// Dom change event listner
MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
var observer = new MutationObserver(function(mutations, observer) {
// fired when a mutation occurs
attachListners();
// ...
});
observer.observe(documentAlias, {
subtree: true,
childList: true
//...
});
问题：我正在构建的库旨在插入任何网站，因此我无法控制 html 实现。我有点担心使用突变观察器可能会进入无限循环。在同一行看到很多堆栈溢出问题。
有没有其他/更好的方法？如何安全有效地检测 DOM 更新/更改？或者突变观察者是最好的选择
推荐指数
解决办法
查看次数
推荐指数
解决办法
查看次数
标签 统计
javascript ×9
jquery ×7
html ×4
ajax ×2
dom-events ×2
asp.net-ajax ×1
captcha ×1
css ×1
cypress ×1
dom ×1
e2e-testing ×1
recaptcha ×1
updatepanel ×1
vue.js ×1