javascript：如何在eval中使用“$（this）”

Question

在我的应用程序中，我使用eval运行通过ajax收到的javascript代码。

我希望能够在通过eval发送的javascript中使用$（this），以便在执行它的代码中使用它。真正的目的是将一些eval代码应用于执行它的最近父代：

$('.json').on('click', function(){ $.ajax(
//my stuff
).success(eval(text_received_via_ajax))});

我希望在text_received_via_ajax中有以下内容：

$(this).closest('.button').doSomething

其中$（this）是点击的实际$（'。json'）元素。

我该怎么做？ 谢谢！

Answer 1

如果您正在编写这样的代码，那么它强烈暗示您的软件设计不好。

你真的不需要使用eval()。不是为了这个，也不是为了其他任何东西。

在你的情况下，我建议调查jQuery's getScript method。

此方法允许您在代码中的给定点按需加载新的Javascript文件。这将取代您现在正在进行的Ajax调用。

您可能还需要修改正在加载的代码，以便将其编写为可调用函数而不是JS代码的开放块。然后，您可以简单地调用它，传入this（或根据您的喜好绑定它），而无需使用eval()。

更简单，更清晰的代码：更易于阅读，更易于维护，更不容易受到错误和黑客攻击，并且您也应该从中获得更好的性能。

Answer 2

通过.bind(this)

$('.json').on('click', function(){ $.ajax(
  //my stuff
).success(eval(text_received_via_ajax.bind(this))});

这会将此上下文注入该函数。请参阅此处more information。

Answer 3

您的代码中有几个错误，eval变为：

$.ajax({...}).success($(this).closest('.button').doSomething());

上面的代码将起作用但不是预期的，因为会调用某些内容，然后函数调用的输出将被指定为成功处理程序。

在从请求中获取值之前，您如何评估？您需要进行一次可以为您评估的回调：

$.ajax({...}).success(function(text_received_via_ajax) {
  eval(text_received_via_ajax);
});

但是等等！现在上下文（this）是错误的，因为处理程序中的this将成为ajax请求。要解决此问题，您需要使用以下命令绑定处理程序的上下文：

function() { console.log(this === newContext); }.bind(newContext)

或者对于较旧的浏览器，jQuery提供$.proxy(fn, newContext)：

$('.json').on('click', function(){
  $.ajax({...}).success($.proxy(function(text_received_via_ajax) {
    eval(text_received_via_ajax);
  }, this));

但请首先使用eval重新考虑！

您可能能够对程序的行为方式提出某种定义，并发送该定义，例如：

{
  'doSomething': true,
  'selector': '.button'
}

然后像这样处理：

var def = { /* the above definition */ }
var $el = $(this).closest(def.selector);

if ( def.doSomething ) $el.doSomething();

Answer 4

公平的警告：使用eval很危险，请确保你知道自己在做什么

由于eval适用于全局范围，因此您必须利用全局范围来实现您想要实现的目标。

从我的观点来看，有两种方法可以做到： 1.将您的eval-code包装到您在eval调用后执行的命名函数中 2.将其保存在具有特定名称的全局变量中，然后在eval-code

中使用

1的示例：

var evalString = "console.log(this);"
var random = Math.random();
var changedEvalString = "function _reference_this() {" +
                          evalString +
                        "}"
eval(changedEvalString); //does not execute a thing
_reference_this.apply(this); //calls your code with the correct this

2的例子：

window._saved_this = this;
eval("console.log(_saved_this)")

我认为解决方案1更清洁，但解决方案2可能更容易。

Answer 5

Json元素返回了哪个值？ 返回元素id或类值？

如果是，您可以使用addEventListener方法或绑定或等于

$('.json').on('click', function(){

$this = this;

    $.ajax({
        type: 'POST',
        url: _url,
        data: 'id=' + data_item,
        dataType: 'JSON',
        success: function (ReturnedJSON) {

$($this).addEventListener('click',function(){
do somethings...
});

$(ReturnedJSON).addEventListener('click',function(){
do somethings...
});

// --- OR ---

$($this).click(function(){
do somethings...
});

$(ReturnedJSON).click(function(){
do somethings...
});

    });

});

我使用$ this val。对于Ajax方法是异步的，所以需要一个载波val 或者你可以在ajax道具上添加这个参数。 “”async：false“”

或者在这里修改另一个代码

var JSON = $.ajax({
dataType: 'JSON',
type: 'POST',
async: false,   ---- if this prop have on ajax method. Javascript waiting complate event for next rows.
url: 'GetModel',
data: 'brand=' + $brand

            }).responseJSON;

Answer 6

通过在匿名函数中使用event参数，您可以使用激活事件的类'.json'访问该元素：

$('.json').on('click', function(event) {
    $.ajax().success(
        eval(text_received_via_ajax)
        $(event.target).closest('.button').doSomething
)});