逃脱的困境。

Question

我有以下

var id='123';

newDiv.innerHTML = "<a href=\"#\" onclick=\" TestFunction('"+id+"', false);\"></a>";

这呈现 <a href="#" onclick="return Testfunction('123',false);"></a> 在我HTML。

我的问题是，我想要呼吁的方法计算，并用作为参数字符串在我的功能StepTwo(string,布尔)，这将最理想的最终在生活HTML如...

<a href="#" onclick="StepTwo("TestFunction('123',false)",true)"></a>

请注意如何计算的是一串的在这里(这是内执行StepTwo eval).

我试图格式，我JS为：

newDiv.innerHTML = "<a href=\"#\" onclick=\"StepTwo(\"TestFunction('"+id+"', false);\",true)\"></a>";

但同时这看到我正在我的IDE,在呈现HTML，它作为garbelled信仰之外。

会更好，如果任何人都可以点我在正确的方向。谢谢！

Answer 1

尝试使用<！> amp; quot;而不是\ <！>“;

newDiv.innerHTML = <！> quot; <！> lt; a href = <！> amp; quot;＃<！> amp; quot; ...

Answer 2

互联网上最大的资本失败之一是通过将字符串粘合在一起来在javascript中创建html。

var mya = document.createElement("a");
mya.href="#"; 
mya.onclick = function(){ 
    StepTwo(function(){ 
        TestFunction('123', false ); 
    }, true );   
};
newDiv.innerHTML = ""; 
newDiv.appendChild(mya);

这消除了任何花哨逃避的需要。

（我可能应该'onclick'以不同方式，但这应该工作，我努力不要只使用jQuery代码来做所有事情）

下面我将如何在jQuery中执行此操作：

jQuery(function($){ 

  var container = $("#container"); 
  var link = document.createElement("a"); /* faster than  $("<a></a>"); */
  $(link).attr("href", "Something ( or # )" ); 
  $(link).click( function(){ 
       var doStepTwo = function()
       { 
            TestFunction('123', true ); 
       };
       StepTwo( doStepTwo, false );  /* StepTwo -> doStepTwo -> TestFunction() */
  });
  container.append(link); 
}); 

在Javascript

中粘合字符串没有好借口

所有这一切都是html解析为dom结构的 ADD 开销，以及基于XSS的破坏HTML的 ADD 潜力。甚至心爱的谷歌在他们的一些广告剧本中弄错了，并且在我见过的许多情况下导致史诗般的失败（并且他们不想知道它）

我不明白Javascript 是唯一的借口，它是 NOT 一个好的借口。

Answer 3

您应该在引用双引号的HTML字符串中使用" not "或\"。

NewDiv.innerHTML = "<a href=\"#\" onclick=\"StepTwo(&quot;TestFunction('"+id+"', false);&quot;,true)\"></a>";

这可能是一种更好的方法 - 只要你发现自己使用eval()，就应该退一步寻找不同的解决方案。

Answer 4

你声称eval是正确的做法。我不太确定。

您是否考虑过这种方法：

<a href="#" onclick="StepTwo(TestFunction,['123',false],true)"></a>

并在StepTwo函数中

function StepTwo(func,args,flag){
    //do what ever you do with the flag
    //instead of eval use the function.apply to call the function.
    func.apply(args);
}

Answer 5

您可以使用DOM方法创建a元素并附加到click事件。

Javascript Framework（就像无处不在的jQuery）会让这更容易。

Answer 6

你最大的问题是使用eval，它导致了很多潜在的问题，找到替代解决方案几乎总是更好。

你当前的问题是你真正拥有的是

<a href="#" onclick="StepTwo("></a>

作为onclick属性启动后的下一个"，将其关闭。使用<！> amp; quot;正如其他人所说。并且不要使用eval。

Answer 7

1. 你需要替换你的<！>和'。

2. 由于Javascripts灵活打字，你可能不需要123周围的引号。传递它没有引号但在TestFunction中将其视为一个字符串。

Answer 8

嘿伙计们，谢谢你的所有答案。我发现“;似乎效果最好。

一旦我获得更多声誉，我会给你们一些票！

关于eval（），您在问题中看到的是正在开发的应用程序的一个非常小的快照。我理解eval的困境，然而，这是百万种情况中的一种，这是当前情况的正确选择。

如果你能看到这些函数的作用（给它们非常通用的stackoverflow名称），那就更好了。

再次感谢！

Answer 9

最好的方法是使用document.createElement创建元素，但如果您不愿意，我猜您可以<a href="#" onclick="StepTwo('TestFunction(\'123\',false)',true)"></a>或使用"。

在您的代码中：

newDiv.innerHTML = "<a href=\"#\" onclick=\"StepTwo('TestFunction(\'"+id+"\', false);\',true)\"></a>";

如果不起作用，请尝试更改<！>“; \' <！>”; to <！> quot; \\' <！> quot;。

请记住<！>“; character用于打开和关闭HTML标记上的属性。如果您在属性的值中使用它，浏览器会将其理解为close char。

实施例： <input type="text" value="foo"bar">最终将<input type="text" value="foo">。

Answer 10

<a href="#" onclick="StepTwo('TestFunction(\'123\', false)', true)">...</a>

Answer 11

我知道这是hella'现在老了，但是，如果任何人有问题，与逃脱串当使用eval(和你绝对必须使用eval)，我已经有了一种方法，以避免的问题。

var html = '<a href="#\" onclick=" TestFunction(\''+id+'\', false);"></a>';
eval('(function(div, html){div.innerHTML = html;})')(newDiv, html);

那么，什么会在这里？

1. eval 创建一种功能，其中包含两个参数， div 和 html 和返回。
2. 该功能立即运行参数的权利eval功能。这基本上是像一个生活.

在这种情况下

var myNewMethod = eval('(function(div, html){div.innerHTML = html;})');

基本上是相同的：

var myNewMethod = function(div, html){div.innerHTML = html;}

然后我们只是在做这样的：

myNewMethod(newDiv, html); //where html had the string containing markup

我会建议不使用eval。如果它不可避免的，或如果控制的所有输入和没有风险的注射那么这将帮助的情况下串逃脱是一个问题。

我也倾向于使用 Function, 但这不是任何更加安全。这里的片断我的使用：

    var feval = function(code) {
    return (new Function(code))();
}