与使用Javascript innerHTML的问题问题、Javascript、innerHTML

2023-09-07 00:59:49 作者:年少轻狂i

好了,基础的问题是在设置div元素的innerHTML,任何HTML标记是在我的字符串被剥离(不显示)的所有主流浏览器除了Firefox浏览器。现在的捕捞,这并不首次加载页面时发生,它只是发生在一个局部回传(除非它的火狐,那么它始终工作)。

Ok, so the base problem is in setting the innerHTML of a div element, any html markup that is in my string is being stripped (and not displayed) in all major browsers except for Firefox. Now for the catch, this doesn't happen when the page is first loaded, it only happens on a partial postback (unless its Firefox, then it always works).

我想运行一个脚本(这实际上正通过一个ScriptManager创建,并从code加到后面)添加一些HTML元素(通过事件处理函数)的一些现有的HTML元素。我知道脚本一直在运行,甚至当我有问题,因为我可以攻击现有元素的HTML或设置一些文字。我甚至可以有文字和标记,但标记不会被渲染,而文会,除非文本标记之内。所以:

I'm trying to run a script (that's actually being created and added from the code behind via a ScriptManager) to add some html elements (with event handlers) to some already existing html elements. I know the script is always running, even when I have the issue because I can nuke the existing element's html or set it some text. I can even have text and markup, but the markup won't be rendered while the text will, unless the text is within the markup. So:

someElement.innerHTML =等等等等等等 - 作品

someElement.innerHTML = "Blah blah blah" -- Works

someElement.innerHTML =< BR />< BR />等等等等等等< BR />< BR />

someElement.innerHTML = "<br/><br/>Blah blah blah<br/><br/>"

显示等等等等等等,但没有休息

Blah blah blah is displayed but with no breaks

someElement.innerHTML =&LT; P&gt;这将会消失&LT; / P&GT;&LT; D​​IV&GT;所以会该&lt; / DIV&GT;

someElement.innerHTML = "<p>This will disappear</p><div>So will this</div>"

所有的文本都将消失,伴随着标记。哦,我看着这个做标准的方式,即document.createElement方法等,但我有相同的问题。

All of that text will disappear along with the markup. Oh, and I looked into doing this the 'standard' way, ie document.createElement etc. but I had the exact same issue.

如果您需要/想人知道什么就问我。

If you need/want to know anything else just ask.

编辑:当我说主要的浏览器,特别是我的意思是:Safari浏览器4.0.3,Chrome浏览器3.0.195.27,和IE 8.0.6

edit: when I say major browsers, specifically I meant: Safari 4.0.3, Chrome 3.0.195.27, and IE 8.0.6

完整的JavaScript(与此相关的功能)。如果出现格式错误,因为这实际上是在C#中的字符串,所以有一堆时髦的逃生废话,我试图删除的清晰度。

The full javascript (related to this function). If there are formatting errors is because this is actually a string in C# so there was a bunch of funky escape nonsense which I tried to remove for clarity.

var overflowEls = getElementsByClass("descriptionBox");

for (var i = 0; i < overflowEls.length; i++)
{
    if (checkOverflow(overflowEls[i]))
    {
        var html = overflowEls[i].innerHTML;
        overflowEls[i].innerHTML = overflowEls[i].innerHTML = "<div class="videoFeedDescriptionButtons" onclick="expand(this);">+</div><br/><div onclick="collapse(this);" class="videoFeedDescriptionButtons">-</div>" + html;              

    }
}

周围的HTML,记住,它正在从一个YouTube的饲料拉,然后生成一个.NET Repeater控件:

The surrounding html, keeping in mind that its being pulled from a youtube feed and then generated by a .net repeater control:

<td valign="top" style="margin: 5px 5px 5px 5px;height:auto;">
  <div class="descriptionBox" style="max-height:100px; overflow:hidden;" >
    <b>
    THE WORLDS BIGGEST PLANES!! by kieran smith</b><br />
    <br />
    by Antonov (ASTC). It was designed for the Soviet space program as a replacement for the Myasishchev M-4 'Bison' for the purpose of carrying the Energia     rocket boosters and to also be able to carry the Buran space shuttle in piggy-back mode much the same as the American Shuttle Carrier Aircraft.The An-225     first flew on 21 December, 1988. Only one An-225 is currently in service. It is commercially available for carrying ultra heavy and/or oversize freight. It     can carry up to 227 metric ...<br />
  </div>
  <a id="ctl00_ContentPlaceHolder1_Repeater1_ctl01_lnView" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Repeater1$ctl01    $lnView','')">View</a>&nbsp;&nbsp;<a id="ctl00_ContentPlaceHolder1_Repeater1_ctl01_lnAdd" 

  href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Repeater1$ctl01$lnAdd','')">Add</a>
 <br />

推荐答案

原来,不知何故的ScriptManager被添加脚本到页面多次。有点。我说的那种,因为它输出的脚本与一些C#格式化的东西还在呢。这里是什么样子:

Turns out that somehow the scriptmanager was adding the script to the page multiple times. Sort of. I say sort of because it is outputting the script with some of the C# formatting stuff still in it. Here's what it looks like:

<script type="text/javascript">

"var overflowEls = getElementsByClass("descriptionBox"); for (var i = 0; i < overflowEls.length; i++) { if (checkOverflow(overflowEls[i])) { var html = overflowEls[i].innerHTML; overflowEls[i].innerHTML = overflowEls[i].innerHTML = "

<div class="\"onclick="\">+</div>

<div onclick="\"collapse(this);\""class="\"videoFeedDescriptionButtons\"">-</div>
"" + html;}}"

</script>

正如你所看到的,一团糟。无论如何,我解决这个移动脚本到aspx页面的功能,只是具有ScriptManager的输出函数调用,所以现在我已经得到了越来越多的在HTML头部函数调用的脚本。现在的脚本不工作,所以我要纪念这个作为回答,并打开了一个新问题,试图弄清楚为什么ScriptManager的是增加重复。

As you can see, a total mess. Anyhow,I 'solved' this by moving the script to the aspx page as a function and just having the scriptmanager output a call to the function, so now I've got an ever increasing number of function call scripts in the html head. The script does work now so I'm going to mark this as answered and open a new question to try to figure out why the scriptmanager is adding duplicates.