使用jQuery定义带连字符的属性

Define hyphenated attribute with jQuery?

本文关键字：属性 连字符 jQuery 定义 使用      更新时间：2023-09-26

我正在使用jQuery mobile和Phonegap制作一个测试应用程序。我有以下页面:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>jQuery Mobile: Theme Download</title>
    <script src="cordova-2.5.0.js"></script>
    <link rel="stylesheet" href="Longmont.min.css" />
    <link rel="stylesheet" href="jquery.mobile.structure-1.3.0.css">
    <script src="jquery.js"></script>
    <script src="jquery.mobile.js"></script>
    <script>
        document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            setTimeout(function() {
                       navigator.splashscreen.hide();
                       }, 500);
        }
    </script>
    <script>
    $(document).ready(function() {
        $.getJSON('http://localhost/api.php', {'id':3}, function(data) {
            var items = [];
            $.each(data, function(key, val) {
                items.push('<div data-role="collapsible"><h1>' + val + '</h1></div>');
            });
            $('<div/>', {
                data-role: 'collapsible-set',
                html: items.join('')
            }).appendTo('#page');
        });
    });
    </script>
</head>
<body>
    <div data-role="page" id="page">
    </div>
</body>
</html>

我试图将项目数组放入一个div, data-role设置为collapsible-content。所以，我编辑属性时，创建它(在$('<div/>', {)。然而，这个属性是连字符的，当我在模拟器中尝试这段代码时，它显示一个空白页面。

在jQuery中，用连字符表示属性的正确方法是什么?

包含-的对象属性必须用引号括起来。

"data-role": value

同样适用于其他操作符和特殊字符，如引号、:、;、空格等。

要用连字符定义属性，请通过Kevin B检查此答案。使用jQuery定义连字符属性?

若要增强可折叠标记，请在将项添加到body后遵循以下方法。

可折叠(参考)

$('[data-role=collapsible]').collapsible();

对于可折叠集(参考)

$('[data-role=collapsible-set]').collapsibleset('refresh');

jQuery的data并不完全类似于dataset，也不应该类似，因为它没有像我们希望的那样得到广泛的支持。data-role是无效的语法，但dataRole也不能工作，即使你希望它可以。你可以这样做:

"data-role": value

或

{data: {role: value}}
http://jsfiddle.net/ExplosionPIlls/dK8ak/1/

相关文章：