Javascript 在返回字符串中调用JS

我试图使模板成为一个函数，返回一个HTML字符串，使JQGRID处于中间。问题：jqGrid需要一个现有元素才能工作，但显然字符串中的函数在字符串本身执行之前运行：

var member_tpl = function(obj){
    return '<div class="meta"> \
        <div class="left"> \
            yada yada \
        </div> \
        <div id="jqGridHerePlease22"></div> \
            '+ createGrid(someObject,"jqGridHerePlease22") +' \
        </div><!-- end class meta --> \
    ';
};

$('.buttonClick').live('click', function(e){
    e.preventDefault();
    writeTemplate('aDialog', member_tpl);
});

如果我在什么地方漏掉了答案，请原谅，我在重复一个问题。建议

编辑：@John Kalberer，下面是createGrid函数中发生的事情：

var createGrid = function(gridData,div){
    var details = $.extend({ gridData },default_grid_settings);
    var rand = randomNum();
    var pager = 'pager'+rand;
    var str = '<div id="'+pager+'"></div>';

    var grid = $('#'+div).append('<table id="aGrid'+rand+'"></table>'+str).find('#aGrid'+rand); 
    var grid_args = $.extend({pager: '#'+pager},details);
    grid.jqGrid(grid_args);  // grid with pager created here
};

---

所以createGrid所做的就是创建网格

问题在于，如果DOM中还不存在给定id，则无法使用该id创建网格。如果您真的希望网格成为模板的一部分，那么您需要将HTML添加到DOM中，插入网格，并获得所需的innerHTML。

您实际上是在响应中包含函数的返回值，而不是函数本身。如果您想包含函数本身，那么您需要将其包含在。。。标记并使其成为字符串

警告:

---

根据浏览器及其在页面document.write或innerHTML中的包含方式，脚本可能无法按预期执行。相反，您可能需要在DOM就绪后使用计时器或onload事件来执行代码，而不是在字符串中包含脚本。确保在所有主要浏览器中进行测试。

我认为这应该适合您。我试图避免更改您的函数签名。此代码尚未测试，因此您可能需要通过将成员\u tpl更改为传入已附加的父元素来将元素附加到dom。然后，您不必在成员_tpl中返回newGrid，而是在创建后附加它

var member_tpl = function (obj) {
    var newGrid = $('<div class="meta"> \
    <div class="left"> \
        yada yada \
    </div> \
    <div id="jqGridHerePlease22"></div> \
    </div><!-- end class meta --> \
    '
    );
    createGrid(someObject, newGrid.find("#jqGridHerePlease22"));
    return newGrid;
};
var createGrid = function(gridData, div){
    var details = $.extend({ gridData },default_grid_settings);
    var rand = randomNum();
    var pager = 'pager'+rand;
    var str = '<div id="'+pager+'"></div>';

    var grid = div.append('<table id="aGrid'+rand+'"></table>'+str).find('#aGrid'+rand); 
    var grid_args = $.extend({pager: '#'+pager},details);
    grid.jqGrid(grid_args);  // grid with pager created here
};

$('.buttonClick').live('click', function (e) {
    e.preventDefault();
    writeTemplate('aDialog', member_tpl);
});

---

createGrid到底在做什么？createGrid函数已添加到我的编辑中。很好！成功了。我唯一需要做的不同的事情是，我必须返回$newGrid[0].html，而不是返回newGrid变量本身。我认为您应该将其返回为newGrid.htmlys，这样更有意义。这对我也很管用。唯一的问题是，由于某种原因，这个网格看起来并不是真正的数据，但我认为这是一个单独的问题。不管怎样，这都是我想知道的问题。这可能与您在将网格连接到dom之前初始化网格有关。

var member_tpl = function (obj) {
    var newGrid = $('<div class="meta"> \
    <div class="left"> \
        yada yada \
    </div> \
    <div id="jqGridHerePlease22"></div> \
    </div><!-- end class meta --> \
    '
    );
    createGrid(someObject, newGrid.find("#jqGridHerePlease22"));
    return newGrid;
};
var createGrid = function(gridData, div){
    var details = $.extend({ gridData },default_grid_settings);
    var rand = randomNum();
    var pager = 'pager'+rand;
    var str = '<div id="'+pager+'"></div>';

    var grid = div.append('<table id="aGrid'+rand+'"></table>'+str).find('#aGrid'+rand); 
    var grid_args = $.extend({pager: '#'+pager},details);
    grid.jqGrid(grid_args);  // grid with pager created here
};

$('.buttonClick').live('click', function (e) {
    e.preventDefault();
    writeTemplate('aDialog', member_tpl);
});