Question

我正在尝试将jQuery函数动态注入元素中。我动态地这样做是因为函数的参数可能会改变。

您可以看到values，min，max属性以及附加到stop和slide事件的函数参数是动态的。因此我认为我会动态注入整个函数，目前我将其作为字符串插入，这显然只是插入文本而不是工作代码。

    $.ajax({
        type: "GET",
        url: "/service.svc/getshopitems/?newurl=" + parseCorrectURL(newURL),
        data: "",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {

//here I'm setting all variables that are used as values in the function to be inserted 

$('.left_nav').append('$(function () {$("#slider_pricefilter").slider({range: true,values: [' + pricemin_query + ', ' + pricemax_query + '],min:' + pricemin + ',max: ' + pricemax 
    + ',stop: function(event, ui){updateResults("price",ui.values[0]+"-"+ui.values[1]);},slide: function (event, ui) {$("#amount").val("' + currencySign + '"+ui.values[0] + " - ' + currencySign + '" + ui.values[1]);}});$("#amount").val("' + currencySign + '"+$("#slider_pricefilter").slider("values", 0) + " - ' + currencySign + '" + $("#slider_pricefilter").slider("values", 1));});');          

        }
    });

这是应插入的实际功能：

$(function () {
    $("#slider_pricefilter").slider({
        range: true,
        values: [12, 24],
        min: 12,
        max: 24,
        stop: function (event, ui) {
            updateResults("price", ui.values[0] + "-" + ui.values[1]);
        },
        slide: function (event, ui) {
            $("#amount").val("€" + ui.values[0] + " - €" + ui.values[1]);
        }
    });
    $("#amount").val("€" + $("#slider_pricefilter").slider("values", 0) + " - €" + $("#slider_pricefilter").slider("values", 1));
});

然而，这似乎是一种过于复杂的方法，因此必须有更好的方法。也许我可以更改现有函数的参数然后再次调用该函数吗？如果这是要走的路，那么如何确保注入的代码真正起作用？

Answer 1

将滑块插入左侧导航栏时。像这样插入

//this functionString will contain all your javascript.
var functionString = '(function() { alert("hi"); })()';

$(".left_nav").append("<div id='slider_pricefilter'></div>");//create the slider div in the left nav
$(".left_nav").append("<script>" + functionString + "</script>");//append the slider event to the slider_pricefilter in the left nav

使用动态参数值注入jQuery函数

1 个答案: