javascript 带有多个参数的jQuery data()?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16671028/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery data() with multiple parameters?
提问by Hosea Kambonde
I want to add data variables to an element before causing a specific behavior, but this may require adding more than one data parameter. How can I accomplish this?
我想在引起特定行为之前向元素添加数据变量,但这可能需要添加多个数据参数。我怎样才能做到这一点?
$("#dlg_box").data("r_redirect","index.php").dialog("open");
回答by 97ldave
回答by SpYk3HH
There are different ways to attach data to a jQuery dialog. If you need to attach multiple Data, I recomend using .data("myData", { /* OBJECT */ }
, however you can also use inline string and array data. As far as why yours won't work, with so little code to go on, it could be numerous things. However, I've attached a working example of a Dialog with "params" or data for you to take example from. If you post more of your header code tho, I have a feeling we might find a syntax error or a lack of "doc ready" included. Just some thoughts. Anyway, my example:
有多种方法可以将数据附加到 jQuery 对话框。如果您需要附加多个数据,我建议使用.data("myData", { /* OBJECT */ }
,但是您也可以使用内联字符串和数组数据。至于为什么你的不起作用,代码很少,可能有很多事情。但是,我附上了一个带有“参数”或数据的对话框的工作示例,供您参考。如果您发布更多标题代码,我有一种感觉,我们可能会发现语法错误或缺少“文档就绪”。只是一些想法。无论如何,我的例子:
jsFiddle
js小提琴
$(function() {
// Set the dialog to not open on load and clear all changes made when closed
$("#dlg").dialog({
autoOpen: false,
modal: true,
close: function(e) {
$(this).children("input").nextAll("p").remove();
}
}) // next i call for my first inner button which will show you how to get "attached" data
.children("#attached").on("click", function(e) {
var dlgData = $("#dlg").data("myData");
$(this).after($("<p />").text(dlgData.data1 + " " + dlgData.data2));
}) // finally, the button that will get the string data that was added in the HTML
.next("#inline").on("click", function(e) {
var dlgData = $("#dlg").data("inline");
$(this).after($("<p />").text(dlgData));
});
// simply open our dialog
$("button").on("click", function(e) {
// HERE data is ATTCHED to our dialog just before opening
$("#dlg").data("myData", { data1: "Hello", data2: "world" }).dialog("open")
});
});
回答by Abilash
JQuery's data()
method also takes an JS Object as a parameter. So you might think of passing {"r_redirect": "index.php", "whatEver": "youWant" ...}
etc to pass multiple values match your requirement.
JQuery 的data()
方法也接受一个 JS Object 作为参数。因此,您可能会考虑通过{"r_redirect": "index.php", "whatEver": "youWant" ...}
等来传递符合您要求的多个值。
Ultimately, the data()
method converts your parameters into an Object. So whether you pass an Object or Key and Value separately should not matter
最终,该data()
方法将您的参数转换为一个对象。因此,您是否分别传递 Object 或 Key 和 Value 都无关紧要
回答by Amit Gupta
$('#Dialog').data('data1', data1).data('data2', data2).dialog('open');
While Initializing the dialog get the values following:
在初始化对话框时获取以下值:
var data1 = $(this).data('data1');
var data2 = $(this).data('data2');
回答by Brett Weber
There are some rules you should be aware of before using this!
在使用它之前,您应该了解一些规则!
ADDING
添加
Adding variables using the object returned from $('.selector').data() works because the data object passes by reference, so anywhere you add a property, it gets added. If you call data() on another element, it gets changed. It is what it is what it is...
使用从 $('.selector').data() 返回的对象添加变量是有效的,因为数据对象是通过引用传递的,所以在您添加属性的任何地方,它都会被添加。如果您在另一个元素上调用 data(),它会发生变化。它是它是它是什么......
Adding an object places a object inside of the data object, as well as "extends the data previously stored with that element." - http://api.jquery.com/data/#entry-longdesc
添加对象会将一个对象放入数据对象中,并“扩展先前与该元素一起存储的数据”。- http://api.jquery.com/data/#entry-longdesc
That means that adding an obj to dataObj becomes
这意味着将 obj 添加到 dataObj 变为
dataObj === { /*previous data*/, obj : { } }
Adding an array does not extend the data previously stored, but doesn't behave the same as a simple value either...
添加数组不会扩展先前存储的数据,但其行为也与简单值不同......
USING
使用
If you have simple values stored, you can place them into variables and do what you want with them without changing the data object.
如果您存储了简单的值,您可以将它们放入变量中,并在不更改数据对象的情况下对它们执行您想要的操作。
however
然而
if you are using an object or array to store data on an element, beware!
如果您使用对象或数组在元素上存储数据,请注意!
Just because you store it to a variable does not mean you are not changing data value. Just because you pass it to a function does not mean you are not changing data values!
仅仅因为您将其存储到变量中并不意味着您不会更改数据值。仅仅因为您将它传递给函数并不意味着您没有更改数据值!
It is what it is what it is.. unless it's simple.. then it's just a copy. :p
这就是它的本质......除非它很简单......那么它只是一个副本。:p
var data = $("#id").data(); // Get a reference to the data object
data.r_redirect = "index.php"; // Add a string value
data.num = 0; // Add a integer value
data.arr = [0,1,2]; // Add an array
data.obj = { a : "b" }; // Add an object
// but here is where the fun starts!
var r_redirectString = data.r_redirect; // returns "index.php", as expected.. cool
r_redirectString = "changed" // change the value and the compare :
data.r_redirect == r_redirectString // returns false, the values are different
var oArr = data.arr; // Now lets copy this array
oArr.push(3); // and modify it.
data.arr == oArr // should be false? Nope. returns true.
// arrays are passed by reference.
// but..
var oObj = data.obj // what about objects?
oObj["key"] = "value"; // modify the variable and
data.obj["key"] == oObj["key"] // it returns true, too!
So, resources..
那么,资源...
What's the best way to store multiple values for jQuery's $.data()?https://stackoverflow.com/a/5759883/1257652
为 jQuery 的 $.data() 存储多个值的最佳方法是什么?https://stackoverflow.com/a/5759883/1257652