Tag: dom

在jQuery中获取边框宽度: 我必须在容器内动态定位一个弹出元素。我正试图获得容器的边框宽度。我发现了几个像这样的问题：如何在jQuery / javascript中获取边框宽度我的问题已经讨论过，但我没有找到任何答案。当属性厚，薄或中等时，如何获得边框宽度？在街上有一句话，你通常可以期望薄，中，厚分别是2px，4px和6px，但CSS规范并不需要。有没有人遇到过简单（或者说不容易，至少一致）的方法来获取DOM元素边缘的边框宽度？

自动生成唯一的DOM ID？: 当使用JS和DOM进行编码时，我发现自己经常需要生成除了将DOM元素组合在一起（或将它们彼此关联）之外没有其他目的的id（或名称） 1 。这些ID（或名称）将不会在代码中的任何其他位置明确提及，因此它们可以是任何随机字符串，并且对于id的情况，它们必须是唯一的。 JavaScript中有标准方法可以自动生成唯一ID吗？ 1说明这种标识符使用的情况在分组（比如说）单选按钮并将它们链接到相关标签时产生…… 我的（天真的noob’s）替代了像这样写HTML的大脑麻木的任务 Linux OS X Windows （这需要每个按钮标签对重复三次基于sys的标识符）才能写入 Linux OS X Windows 然后使用一些JS将按钮分组到一个name属性下，并将标签链接到各自的按钮： $(‘.button-group’).each(function (i, e) { var name = $(e).attr(‘name’); $(e).find(‘:radio’).each(function (j, f) { var id = name + ‘-‘ + j; $(f).attr(‘name’, name) .attr(‘id’, id) .next() .attr(‘for’, id); }) }); 这工作正常，但它仍然需要我为这些按钮组提供名称，并为按钮，名称和ID提供唯一的ID，这对我来说是无用的。我会尽快避免所有这些无偿的命名业务 Linux OS X Windows $(‘.button-group’).each(function (i, e) […]

除了在怪癖模式下，IE中的InnerHTML / outerHTML不反映复选框状态: 我目前正在与一个IE JavaScript / DOM bug（很有趣）进行斗争，这真的让我很难过。有问题的代码将一些复选框复制到一个表单中，需要保持其检查状态。问题是，IE（特别是IE8，虽然我也猜测其他人）不想这样做。我已经将bug本身缩小到一个非常小的测试用例。基本上，在页面上没有DOCTYPE的情况下工作正常但是当DOCTYPE存在时它们会被破坏。我本来期待相反的，但谁知道IE。以下是最简单的测试用例。对于每个人：在IE中打开页面，切换复选框，然后单击“测试”。不会产生错误： TEST document.getElementById(‘break’).onclick = function() { alert(document.getElementById(‘broken’).outerHTML); }; 链接产生错误： TEST document.getElementById(‘break’).onclick = function() { alert(document.getElementById(‘broken’).outerHTML); }; 链接错误发生在有效页面上（使用，，等）以及输入是否在表单内。在“破碎”的情况下，outerHTML总是反映页面加载时出现的内容（如果我默认选中了输入，那么它总是使用CHECKED警告代码，即使我先取消选中它）。如果我包装输入并使用innerHTML，事情就会以同样的方式发生。在实际的网站上我使用jQuery的.clone（）方法进行复制; .clone（）在内部使用.outerHTML，这就是我缩小范围的方法。我的问题是：有没有办法自己手动构建新的HTML？有没有人知道为什么会出现这种情况（除了“IE SUX LOLZ”之外）？

在页面加载时显示加载图像: 我想在页面尚未加载时显示Loading图像。在加载页面之前，它向用户显示一个blank white page 。所以，我想删除白色空白区域。该页面的数据库命中次数太多，因此加载速度会慢一些。我查过这篇文章，但这不起作用。我已经检查了添加<![CDATA[脚本的正面，如博客文章中所述。这不起作用。最后，我已经登陆提问，尽管它是重复的。这是我的剧本。 // 在身体里 Loading 加载的CSS是： .loading { font-family: Arial; font-size: 10pt; padding:20px; position: fixed; background-color: #ffffff; z-index: 99999; border-radius:5px; } 我的代码出了什么问题？有人可以指出或提供有效的解决方案。干杯!!! KARTHIK

React渲染输入的触发器更改事件（类型=范围）: “反应”：“^ 15.4.2” 我无法从jquery触发使用React呈现的输入的更改事件。我需要做一些端到端的测试。这是一个沙箱作为一个完整的展示： https ：//codesandbox.io/s/pp1k1kq3om已经加载了jquery。如果你在控制台中运行：$（’＃reactSlider’）。val（50）.change（），你会注意到没有调用更改处理程序。在上面的沙箱中还有一个纯html滑块用于比较，一个按预期工作（调用更改函数）。还试图派出这样的新事件： var event = new Event(‘change’) var target = $(‘#reactSlider’)[0]; target.dispatchEvent(event); 以上也不起作用（并且可以在纯html滑块上工作）。 import React from “react”; import { render } from “react-dom”; const changeHandler = event => { alert(`react slider changed:${event.target.value}`); }; const App = () => ( react-slider run in the console: $(‘#reactSlider’).val(50).change() Notice that […]

使用jquery解析XMLHttpRequest.responseText: 执行XMLHttpRequest后如何用jquery解析responseText？我试过了 var parsed = $ .parseHTML（data）; 但结果是DOM数组，我无法通过$(parsed).find(‘#myIDobject’)左右选择任何内容。

使用跨浏览器支持的jQuery更改类型: 问题以下脚本完全符合我的要求，在除IE8之外的所有测试的浏览器中，它删除按钮而不用任何替换它。背景我一直在研究一种方法，用jQuery替换提交类型输入和图像类型输入。首先，我有以下内容适用于FF和webkit： marker = jQuery(”).insertBefore(‘input#SearchButton’); jQuery(‘input#SearchButton’).detach().attr(‘type’, ‘image’).attr(‘src’,theme_folder+’/style/images/search_button.png’).insertAfter(marker); marker.remove(); 但是，如果IE（它删除按钮，但不替换为图像），所有6个版本都会失败，所以我为IE浏览器开发了以下脚本： marker = jQuery(”).insertBefore(‘input#SearchButton’); new_search = jQuery(”) jQuery(new_search).insertAfter(‘input#SearchButton’); jQuery(‘input#SearchButton’).remove(); marker.remove(); 我正在使用HTML Conditionals来过滤到适当脚本的流量，所以整个事情看起来像这样： marker = jQuery(”).insertBefore(‘input#SearchButton’); jQuery(‘input#SearchButton’).detach().attr(‘type’, ‘image’).attr(‘src’,theme_folder+’/style/images/search_button.png’).insertAfter(marker); marker.remove();

如何将不同尺寸的点击坐标转换为320尺寸？: 我非常恼火地找到将各种设备维度的点击坐标转换为320 [iPhone 4]屏幕的解决方案。我有所有需要的数据，如元素偏移，点击偏移，窗口宽度/高度等，但没有找到任何适当的解决方案，将其转换为320。例如，我需要转换下面提到的X，Y，我从480屏幕收集：元素偏移量x，y [30,1903] 单击x，y中的偏移[225,38] //这里我提到了元素的单击偏移而不是文档/窗口。元素宽度/高度（以px为单位）[420,38] 和下面是我将此数据转换为320后所期望的结果。 [X，Y] = [161,38] 任何人都可以帮我这样做吗？

如何使用带有substr的strip_tags来正确获取内容并避免破坏html标签？: 在我的页面中，我有一些来自RSS提要的post预览。每个post预览显示约300个字符。当用户单击展开按钮时， #post-preview将替换为#post 。 #post显示post的其余部分。一切都很好，但#post的格式不好，不可读。所以我想到允许使用标签，它可以让你读取。因为我不希望用户分心，我希望在300个字符之后允许标记。使用以下方法，可以打破$start结束和$rest开始的一些标记。这意味着没有良好的可读输出。 $start = strip_tags(substr($entry->description, 0, 300)); $rest = strip_tags(substr($entry->description, 300), ”); $start . $rest; 我的问题是如何保持$start和$rest （没有标签）直到300 char，之后$rest将显示格式化的post？有没有其他方法可以做到这一点？以下是RSS提要结构的示例（来自视图页面源）。我正在寻找一种不会破坏性能的方法。

使用AJAX加载元素时重新加载JS函数: $(‘#followUser’).click(function () { var userId = $(this).attr(‘data-userId’), action = $(this).attr(‘data-action’), currentUser = $(this).attr(‘data-currentUserId’), elem = $(this); $.ajax({ method: ‘POST’, url: “/sci-profile/profile/follow”, data: { userId: currentUser, profileUserId: userId, action: action }, success: function(response) { elem.parent().load(window.location.href + ‘ #unFollowUser’); } }); }); 点击按钮后，JS加载了包含其所有内容的新div，这很好，但是在加载新div时会出现问题。 JS无法识别新ID 。当我点击新按钮时没有任何反应，因为当新元素不存在时，JS函数已加载。有没有办法让一些监听器检查新DIV加载，然后加载对应于该元素ID JS函数？