الهروب من المعضلة في جافا سكريبت

Question

لدي ما يلي

var id='123';

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

الذي يجعل <a href="#" onclick="return Testfunction('123',false);"></a> في HTML الخاص بي.

المشكلة التي أواجهها هي أنني أرغب في استدعاء الأسلوب TestFunction، واستخدامه كمعلمة سلسلة في وظيفتي StepTwo(string, boolean)، والتي من المفترض أن تنتهي بشكل مثالي في HTML المباشر كما هو موضح ...

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

لاحظ كيف أن TestFunction عبارة عن سلسلة هنا (يتم تنفيذها داخل StepTwo باستخدام eval).

لقد حاولت تنسيق JS الخاص بي عن طريق:

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

ولكن بينما يبدو لي أن هذا صحيح في IDE الخاص بي، في HTML المقدم، فهو مشوه بشكل لا يصدق.

سأكون ممتنًا إذا كان بإمكان أي شخص أن يوجهني في الاتجاه الصحيح.شكرًا!

Answer 1

حاول استخدام "بدلاً من "

newdiv.innerhtml = "

Answer 2

أحد أكبر حالات فشل رأس المال على الإنترنت هو إنشاء HTML في JavaScript عن طريق لصق الأوتار معًا.

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); 
}); 

لا يوجد عذر جيد للملصقات معا في جافا سكريبت

كل ما تفعله يضيف عودة تحليل HTML إلى هياكل DOM ، و يضيف إمكانات HTML المعطلة القائمة على XSS. حتى جوجل المحبوب احصل على هذا الخطأ في بعض البرامج النصية الإعلانية الخاصة بهم وتسبب إخفاقات ملحمية في كثير من الحالات رأيتها (ولا يريدون معرفة ذلك)

لا أفهم جافا سكريبت هو العذر الوحيد ، وهو ليس جيد.

Answer 3

يجب أن تستخدم " ليس " أو \" داخل سلسلة HTML مقتبسة مع Quotes مزدوجة.

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

يمكنك إنشاء عنصر A وإرفاقه بحدث النقر باستخدام أساليب DOM.

إن إطار عمل JavaScript (مثل jQuery في كل مكان) سيجعل هذا أسهل كثيرًا.

Answer 6

أكبر مشكلة تواجهك هي استخدام التقييم، فهو يؤدي إلى العديد من المشكلات المحتملة، ومن الأفضل دائمًا العثور على حل بديل.

مشكلتك المباشرة هي أن ما لديك حقًا هو

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

كما يلي " بعد بدء السمة onclick، يتم إغلاقها.يستخدم "كما اقترح آخرون.ولا تستخدم التقييم.

Answer 7

1. تحتاج إلى بالتناوب "و".

2. ربما لا تحتاج إلى اقتباسات حول 123 ، بسبب كتابة JavaScripts المرنة. مررها بدون علامات اقتباس ولكن تعامل معها كسلسلة داخل TestFunction.

Answer 8

مرحبًا يا شباب ، شكرًا على كل الإجابات. أجد أن quot ؛ يبدو أنه يعمل بشكل أفضل.

سأعطيكم يا رفاق بعض الأصوات بمجرد أن أحصل على المزيد من السمعة!

فيما يتعلق بـ 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>";

إذا لم ينجح ذلك ، فحاول التغيير "\'" إلى "\\'".

تذكر أنه "يتم استخدام الحرف لفتح وإغلاق السمة على علامات HTML. إذا كنت تستخدمها في قيمة السمة ، فسوف يفهمها المستعرض على أنه Char Close.

مثال:<input type="text" value="foo"bar"> سينتهي به المطاف <input type="text" value="foo">.

Answer 10

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

Answer 11

أعلم أن هذا قديم الآن ، ولكن إذا كان لدى أي شخص مشكلات مع السلاسل النار عند استخدام EVEL (وعليك استخدام 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. هذا يشبه في الأساس iife.

في هذه الحالة

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))();
}