Questions tagged «html»

我是Angular的新手。我在Angular上有一些工作。 我需要Json通过调用Rest Api为来自服务器的数据绑定嵌套下拉列表。 数据具有一个属性LgLevel，指定组层次结构中的级别。家长会level=0，即时Child=1，Grandchild=2等等。Child并Grandchild具有ParentLocationGroup字段，该字段显示在哪个父菜单，子菜单中。 这是我的json数据。我有大量数据，但没有全部显示。 { "ArrayOfLocationGroup": { "LocationGroup": [ { "Id": "628", "Name": "TEST1", "GroupId": { "_xmlns": "http://www.air-watch.com/servicemodel/resources" }, "ParentLocationGroup": { "_uuid": "bdce4396-9c60-4831-90f2-6f793becb362", "__text": "570" }, "LgLevel": { "_xmlns": "http://www.air-watch.com/servicemodel/resources", "__text": "0" } }, { "Id": "630", "Name": "TEST2", "GroupId": { "_xmlns": "http://www.air-watch.com/servicemodel/resources", "__text": "PAM-TEST" }, "ParentLocationGroup": { "_uuid": …

15 html  angular  typescript 

我正在尝试使用CSS创建过山车风格的动画。 我想知道在循环阶段如何弯曲“过山车”。 我正在寻找所有CSS解决方案，但是如果需要一点JavaScript，我可以接受。 到目前为止，我的代码： #container { width: 200px; height: 300px; margin-top: 50px; position: relative; animation: 10s infinite loop; animation-timing-function: linear; } #coaster { width: 100px; height: 10px; background: lightblue; position: absolute; bottom: 0; left: 1px; right: 1px; margin: 0 auto; } @keyframes loop { from { margin-left: -200px; } 30% …

15 html  css  css-animations  css-transforms 

我有以下代码段（需要以全屏模式查看），我试图将<main>元素直接放置在元素下方<header>。我将<header>其固定在一个位置，因为当用户滚动浏览内容时，我希望它停留在屏幕顶部<main>元素中。我已经尝试了所有我知道的东西，但是我能想到的最好的办法是将该<header>元素放在该元素的顶部<main>，这样可以减少大部分内容。 我想出的最接近的解决方案是在<main>元素上加上一个推测的顶部填充，以便清除<header>。但是，此解决方案无法很好地说明各种屏幕尺寸，因为我使用的是rem sizing而不是px。当将多个元素放置在<header>使用相对或基于百分比的高度的元素内时，顶部填充的想法变得更糟。在一个屏幕尺寸上，所有内容都可以完美地排列在一起；在另一个屏幕尺寸上，内容可能相去甚远。 最后，我知道我可以使用jQuery动态设置顶部填充，但是它似乎并不总是能很好地工作。想知道是否有一个纯CSS / HTML解决方案。 谁能告诉我我在这里想念的东西吗？我的最佳填充方法是唯一可行的解​​决方案吗？ $(document).ready(function() { $('#navToggle').click(function() { $("div#bottom-container > nav").slideToggle(); }); $(window).resize(function() { if(window.innerWidth >= "751") { $("header > div#bottom-container > nav").show(); }else { $("header > div#bottom-container > nav").hide(); } }); $("header > div#bottom-container > nav > ul > li > a").click(function(e) { if (window.innerWidth <= …

15 html  css  css-position  fixed 

我们可以使用它window.location.replace来避免历史记录，并定位页面锚，而无需重新加载页面，但不能在iframe中使用吗？ 问题是违反了CSP（内容安全策略），script-src 'unsafe-inline'必须启用该状态。除非我没有定义CSP，即使我定义了一个CSP并允许script-src 'unsafe-inline'它仍然给出相同的违规错误。在ie11 / chrome / ff中得到相同的结果。 iframe位于同一域（位于同一目录中）。 在控制台中定位iframe并在控制台中使用window.location.replace('/samepage.html#onpage_anchor')。 有用。 它以页面锚为目标，而无需重新加载页面和历史记录。 将相同的代码内联在锚链接上，它可以工作。 在外部脚本中使用相同的代码，获取csp违规错误。 如果不在iframe中，则效果很好。 我试图创建一个CSP允许的动作，但即使是在最宽松的内容安全策略可能会允许它。 编辑：所以我将示例放到允许多个文件的插件上，这样我就可以使用引用父/子页面的正确hrefs。 有关示例的示例的注释： 这些示例中未重现该问题。 该脚本即使在iframe中也可以完美运行。但是，相同的代码在我的本地服务器上不起作用，或者当我在VPS上实时运行该代码时。 我怀疑在plunker上不会触发CSP违规，因为plunker通过某种抽象层将内容呈现给浏览器。 第一次单击父级中的手风琴链接时，它会刷新。这是因为页面最初加载的方式没有引用index.html。后续点击将按预期工作，而无需重新加载页面。在iframe中这不是问题，因为它最初会引用child.html 这些是显示代码而无需进行任何更改即可使其工作的很好的示例（如需要更改href使其在stackoverflow代码段中工作，如下所述）。这也很好，因为它显示了javascript应当正常工作。但这并没有显示出实际的问题。您仍然需要在编辑器中加载它，然后在本地服务器或实时托管环境中运行它，才能看到真正的问题。 柱塞示例 有脚本： 无历史记录 无脚本： 有历史记录 简化的代码示例 一键输入的简单手风琴。足以重现问题。 单击打开/关闭将展开/折叠手风琴，不需要JS。JS应该做完全相同的事情，但是没有历史记录。工作正常，但不能在iframe中使用。 代码段注释： 您可以运行该代码段以了解我所描述的内容，但实际上并不能证明问题所在。 该代码段的行为与实际浏览器中的行为不同，JavaScript无法正常工作。 该代码段显示了代码，但应在iframe中运行以查看问题。在iframe外部运行它，以查看差异以及其工作原理。 由于链接如何与JS配合使用（替换整个url），因此它们实际上必须像这样，href="https://stackoverflow.com/thispage.html#ac1"而不是 href="#ac1"像它们出现在代码段中一样（不能以代码段中的实际html页面为目标）。因此，如果您在编辑器中尝试此操作 （请这样做），请记住将链接更改为此格式， this_document.html#anchor以使它们仍然是相同的页面定位点，但是page.html包含在链接中。 显示代码段 $(document).ready(function() { // anchor links without history $.acAnch = function(event) …

15 javascript  html  iframe  browser-history  content-security-policy 

我是Next.js的新手，并且想知道如何从起始页（/）重定向到/ hello-nextjs。用户加载页面后，确定路径是否=== /重定向至/ hello-nextjs 在react-router中，我们执行以下操作： <Switch> <Route path="/hello-nextjs" exact component={HelloNextjs} /> <Redirect to="/hello-nextjs" /> // or <Route path="/" exact render={() => <Redirect to="/hello-nextjs" />} /> </Switch>

15 html  reactjs  routing  react-router  next.js 

我无法﷼在数字前粘贴字符（里亚尔货币）： 1﷼ 甚至不可能将其粘贴在2个数字之间，并粘贴在末尾： 11﷼ 如果您尝试将其粘贴到字母前面，则没有任何问题： ﷼a 有人知道会发生什么以及我该怎么做吗？

14 html 

这赏金已经结束。这个问题的答案有资格获得+500声望奖励。赏金宽限期在23小时内结束。 Ferit希望引起更多关于这个问题的注意。 如何在不假定宽高比的情况下使iframe响应？例如，内容可以具有任何宽度或高度，在渲染之前是未知的。 注意，您可以使用Javascript。 例： <div id="iframe-container"> <iframe/> </div> 调整大小iframe-container以使其内容几乎不能容纳在里面而没有多余的空间，换句话说，有足够的空间容纳内容，因此无需滚动即可显示内容，但没有多余的空间。容器完美地包裹了iframe。 假设内容的纵横比为16：9，这说明了如何使iframe响应。但是在这个问题上，纵横比是可变的。

14 javascript  html  css  iframe  responsive-design 

当我输入最后一个数字时，第一个数字在text-box（消失）里面，这增加了一个额外的空间。 在外部单击后text-box，看起来不错，这是我键入最后一个字符时所需的。 #number_text { padding-left: 9px; letter-spacing: 31px; border: 0; background-image: linear-gradient(to right, #e1e1e1 70%, rgba(255, 255, 255, 0) 0%); background-position: left bottom; background-size: 38px 1px; background-repeat: repeat-x; width: 220px; box-sizing: border-box; outline:none; } <input type="text" id="number_text" maxlength="6" pattern="\d{6}" value="1234" > 运行代码段隐藏结果展开摘要 帮助我摆脱这个问题。谢谢

14 javascript  jquery  html  css 

我在本地主机（Windows 7，Chrome v79.0.3945.130（64位））上测试了html / js代码，并且大约50％的时间代码更改未反映在浏览器中（我可以通过Dev Tools / Sources查看） ）。 互联网上有很多建议，但似乎都行不通： 右键单击重新加载，然后选择“清空高速缓存和硬重新加载”-在30％的情况下无济于事。 在Chrome开发者工具的“网络”标签中禁用缓存-无效。 <meta http-equiv="Cache-control" content="no-cache">在标题中添加-没有帮助。 替换<script src="common.js"></script>为<script src="common.js?blabla"></script>-在60％的情况下有帮助，但每次更改都是一件繁琐的事后，您需要这样做。此外，它不适用于html更改。 将文件复制到新文件（如index.html到index2.html）并替换代码中的文件名-总是可以的，但要花很多时间。 当我将代码提交到github.io时，存在完全相同的问题 请帮助我做到这一点，以便该站点立即反映出代码更改。 编辑：我创建了一个文件index3.html，并只在其中放置“ hello world”。在浏览器中打开文件。更改为“ hello world2”-浏览器更新了内容。更改为“ hello world3”-即使多次重载和“空缓存和硬重载”后，浏览器仍显示“ hello world2”。我改为“ hello world4”-浏览器仍然显示“ hello world2”。在4个小时内，我更改为“ hello world5”-浏览器仍然显示“ hello world2”。我使用基本记事本编辑了此文件。 Edit2：人们一直在问我正在使用什么服务器。这看起来像是问题的一部分。不幸的是，我不知道，我也不知道我需要做什么来检查它。到目前为止，这是我发现的所有内容： 我有inetpub/wwwroot放置html和js文件，然后在的浏览器中打开index.html的目录http://localhost/。 Devs Tools中的“我的网络”面板如下所示：image link。 服务器设置非常快，不需要安装任何其他软件。即我不使用node.js。 inetpub/wwwroot当我打开iisstart.htm时，http://localhost/iisstart.htm它显示为IIS7。

14 javascript  html  server  browser-cache 

我想通过JS创建一些html，因此需要在JS文件中编写html，例如： function createHtmlSection() { return "<li class=\"chapter up-wrapper-btn\">" + "<div>" + "<button><i class=\"fa fa-plus\" onclick=\"addSection('up',this)\"></i></button>" + "<label contenteditable=\"true\">section 1</label>" + "</div>" + "</li>"; } 是否有工具或某种快捷方式来创建这种类型的html字符串？ 我的意思是，在这种情况下，我需要手动键入所有这些html。与+并且需要添加"符号。 可以将其转换的东西： <li class="chapter up-wrapper-btn"> <div> <button><i class="fa fa-plus" onclick="addSection('up',this)"></i></button> <label contenteditable="true">section 1</label> </div> </li> 到我需要手动输入的第一个字符串

14 javascript  html 

我创建了一个自动化程序，该程序可以让我在网站上输入详细信息（尽管我不能共享它，因为它是内部的）。我下面的代码仅在输入“ received from”的文本之前有效。但是，此“接收自”字段具有自动完成列表，我需要选择它才能填充其他字段，例如TIN和“地址”。 自动完成列表与https://jqueryui.com/autocomplete/中的列表非常相似， 或者 http://demos.codexworld.com/autocomplete-textbox-using-jquery-php-mysql/中的 下面是我的代码： Sub Automate_IE_Enter_Data() 'This will load a webpage in IE Dim i As Long Dim Url As String Dim IE As InternetExplorer Dim objElement As Object Dim objCollection As Object Dim HWNDSrc As Long Dim wsTemplate As Worksheet Dim objEvent As Object Dim li_arr …

13 html  excel  vba  web-scraping  autocomplete 

Chrome浏览器自动填充去除的效果background-color，并background-image从Username与Password输入字段。 自动完成之前 自动完成后 但是Chrome浏览器的自动完成功能会在输入中隐藏我的图标，也更改了我的图标background-color。所以我需要我的图标原样保留在输入中。 是否可以阻止Chrome浏览器更改字段的背景色并隐藏图像？ .form-section .form-control { border-radius: 4px; background-color: #f7f8fa; border: none; padding-left: 62px; height: 51px; font-size: 16px; background-repeat: no-repeat; background-position: left 17px center; } .form-section .form-control:focus { -webkit-box-shadow: none; box-shadow: none; } .form-section .form-group { margin-bottom: 21px; } .form-section .form-control[type="email"] { background-image: url('https://i.stack.imgur.com/xhx3w.png'); } .form-section .form-control[type="password"] { …

13 javascript  html  css  google-chrome 

在以下示例中，当您单击标签时，输入将更改状态。 document.querySelector("label").addEventListener("click", function() { console.log("clicked label"); }); label { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } <input type="checkbox" id="1"> <label for="1">Label</label> 运行代码段隐藏结果展开摘要 在Chrome中，当您在mousedown和mouseup事件之间移动光标时，输入仍会被触发，而在Firefox中，此复选框不会更改状态。 有没有办法来解决这个问题？（不使用JavaScript事件侦听器） Firefox版本： 69.0.3 (64-bit) 使用Chrome浏览器时的全套操作。 按下标签上方的按钮 仍然按住按钮的同时，将光标移动到周围（甚至在标签之外） 将光标返回到标签 释放按钮

13 javascript  html  css  label 

我有一个html表，我想从一个单元格到另一个单元格绘制一个箭头。例如这样： 怎么办呢？ HTML示例： <html> <body> <table> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td id="end">9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td>0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> <tr><td id="start">0</td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td><td>8</td><td>9</td><tr> </body> </html> 如果调整浏览器的大小，箭头应停留在（新）开始/结束位置。

13 javascript  html  svg 

在Windows 7上使用Firefox v73发生以下问题： 在我的代码中，我在html中使用了一个多文件选择器，最多可以并行上传100个文件： <input type="file" id="files" name="files" multiple> 这些文件将被发送到REST-API，然后对其进行处理。当我选择一个当前正在使用的文件（在文件浏览器中）时，我收到一条错误消息（可能是通过窗口显示），告诉我该文件由于正在使用中而无法被选择。如果我尝试选择包含一个或多个正在使用的文件的多个文件，则不会发生任何错误，但是当达到使用中的文件并等待文件释放时，上传似乎停止了。这导致请求等待超时（在我的情况下为1分钟）。 在尝试上传文件之前，是否有任何选项可以解决问题（使用中的文件）？ PS：我在Chrome中尝试过相同的操作，在将请求发送到REST-API之前，它会返回错误。

12 html  firefox  multifile-uploader  filepicker