3

仅加载wizard.js 和require.js 时出现此错误：

TypeError: $(...).wizard is not a function


$('#checkout-wizard').wizard({'selectItem': options.step });

我错过了一些js吗？我不想加载整个项目。

10倍

4

1 回答 1

3

这是一个仅加载向导的工作示例：

http://jsbin.com/kesikoli/1/

资源：

<html class="fuelux">
<head>
    <title>wizard</title>
    <link href="//www.fuelcdn.com/fuelux/2.6.0/css/fuelux.min.css" rel="stylesheet" type="text/css">
    <style>
        body { padding: 20px }
    </style>
    <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.11/require.min.js">    </script>
    <script>
        require.config({
            paths: {
                'fuelux': 'http://www.fuelcdn.com/fuelux/2.6.0/',
                'jquery': 'http://code.jquery.com/jquery-1.11.0.min'
            }
        });
        require(['fuelux/wizard']);
    </script>
</head>
<body>
<div id="MyWizard" class="wizard">
    <ul class="steps">
        <li data-target="#step1" class="active"><span class="badge badge-info">1</span>Step 1<span class="chevron"></span></li>
        <li data-target="#step2"><span class="badge">2</span>Step 2<span class="chevron"></span></li>
        <li data-target="#step3"><span class="badge">3</span>Step 3<span class="chevron"></span></li>
        <li data-target="#step4"><span class="badge">4</span>Step 4<span class="chevron"></span></li>
        <li data-target="#step5"><span class="badge">5</span>Step 5<span class="chevron"></span></li>
    </ul>
    <div class="actions">
        <button type="button" class="btn btn-mini btn-prev"> <i class="icon-arrow-left"></i>Prev</button>
        <button type="button" class="btn btn-mini btn-next" data-last="Finish">Next<i class="icon-arrow-right"></i></button>
    </div>
</div>
<div class="step-content">
    <div class="step-pane active" id="step1">This is step 1</div>
    <div class="step-pane" id="step2">This is step 2</div>
    <div class="step-pane" id="step3">This is step 3</div>
    <div class="step-pane" id="step4">This is step 4</div>
    <div class="step-pane" id="step5">This is step 5</div>
</div>
</body>
</html>

Fuel UX 3.0+ 的加载策略很可能会发生变化

于 2014-04-03T22:59:13.430 回答