訪問HTML5數據屬性

我正在嘗試使用HTML5數據屬性。但是我使用的是EasyUI框架，它存在問題。訪問HTML5數據屬性

HTML5定義選項設置如下： <div data-options="{region:'north', title:'North Region', border:true}">

但EasyUI強制它們設置一樣（沒有大括號）： <div data-options="region:'north', title:'North Region', border:true">

是否有訪問屬性對象不寫我自己的方式解析器功能？如果我必須我必須但我認爲必須有更好的方法。

感謝您的任何幫助。

來源

2012-11-20 user1389920

第一步：文件與EasyUI的錯誤。第二步：使屬性有效的JSON，以便解析它。 – epascarello

這兩種形式都不是有效的JSON，所以是的，你必須編寫自己的解析器。 – Pointy

您可以使用jQuery .data（）或.attr（） –

看看源代碼，有一種方法可以做到這一點。

$.parser.parseOptions(element);

演示只用該方法提取：http://jsfiddle.net/FnJAE/

注：此方法未記錄，因此它是隨時更改，恕不另行通知。

來源

2012-11-20 19:19:38

這正是我想要的。完美的作品。非常感謝！ – user1389920

如果你知道它會永遠被格式化爲一個對象，你可以只：

jsonData = JSON.parse("{" + element + "}");

來源

2012-11-20 19:32:41 jeremy

這將無法正常工作，即使括號中的json仍然無效。 –

僅供參考，你真的沒有做所有的解析。雖然你的HTML確實需要加引號一些變化：_{See Reference jQuery.Data() HTML5}

HTML

<div id="Bob" data-options='{"region":"north", "title":"North Region", "border":"true"}'></div>

腳本

console.log($("#Bob").data("options").title); 
// Will return String "North Region" 

console.log($("#Bob").data("options").region); 
// Will return String "north" 

console.log($("#Bob").data("options").border); 
// Will return String "true" 

console.log($("#Bob").data("options") 
// will return a JSON Object but it is EASY to convert to Array 
var eleData = $("#Bob").data("options"), 
    eleArray = new Array(); 
for (x in eleData) { eleArray[x] = eleData[x]; }

來源

2012-11-20 20:05:10 SpYk3HH

我同意，修正數據是正確的json，但這不是一個選項，沒有修改easyui核心（這不會是那麼困難，tbh）。 http://www.jeasyui.com/documentation/index.php# –

我仍然說jQueryUI是100倍更好，更有利。 – SpYk3HH

訪問HTML5數據屬性

回答

相關問題