Question

我收到此错误，我不知道如何解决。我之前看过this link。

修改：1

index.php

<script type="text/javascript">
$(document).ready(function() {   
    $("#customForm").submit(function() {
        var formdata = $("#customForm").serializeArray();

        $.ajax({
            url: "sent.php",
            type: "post",
            dataType: "json",
            data: formdata,
            success: function(data) {
                switch (data.livre) {
                case 'tags':
                    $("#msgbox2").fadeTo(200, 0.1, function() {
                        $(this).html('Empty tags').fadeTo(900, 1);
                    });
                    break;

                default:
                    $("#msgbox2").fadeTo(200, 0.1, function() {
                        $(this).html('Update').fadeTo(900, 1, function() {
                            $('#conteudo').load('dojo/test_Slider.php');   
                        });
                    });
                    break;
                }
            }
        });

        return false;
    });
});
</script>

test_slider.php

<script type="text/javascript">

var slider = [];

for (i = 0; i < 5; i++) {

    slider[i] = (

    function(i) {

        return function() {

            var node = dojo.byId("input"+[i]);
            var n = dojo.byId("valores"+[i]);

            var rulesNode = document.createElement('div'+[i]);
            node.appendChild(rulesNode);

            var sliderRules = new dijit.form.HorizontalRule({
                count:11,
                style:{height:"4px"}
            },rulesNode);

            var labels = new dijit.form.HorizontalRuleLabels({
                style:{height:"1em",fontSize:"75%"},
            },n);

            var theSlider = new dijit.form.HorizontalSlider({
                value:5,
                onChange: function(){
                    console.log(arguments);
                },
                name:"input"+[i],
                onChange:function(val){ dojo.byId('value'+[i]).value = dojo.number.format(1/val,{places:4})},
                style:{height:"165px"},
                minimum:1,
                maximum:9,
                   }
            },node);

            theSlider.startup();
                sliderRules.startup();
        }

    })(i);
    dojo.addOnLoad(slider[i]);
}

</script>

问题：首先点击提交btn一切正常，导入5个滑块。第二次点击，假设有更新，但我收到此消息：

Tried to register widget with id==valores0 but that id is already registered

[演示视频] 2

Answer 1

只是加入@jioo的答案和@Kevin的评论。您可以通过查看注册表来浏览现有的dijits：

var i = i || 0; // Cache this at the end of your loop
dijit.registry.map(function (widget) {
    if (+widget.id.replace(/^[^\d]+/, '') <  i) {
        widget.destroyRecursive();
    }
});
/*
    Your loop fixed as described in missingno's answer.
*/

Answer 2

你陷入了在for循环中制作函数闭包的古老陷阱。当addOnLoad触发并创建滑块时，i将等于2，两个滑块将尝试使用相同的DOM节点（不允许的话）。

您需要确保为每个人提供i的全新副本。以下是快速解决方法：

for(i=0; i<2; i++){
    (function(i){

        slider[i] = ...

        //everything inside here remains the same
        //except that they now use their own i from the wrapper function
        //instead of sharing the i from outside.
    }(i));
}

Answer 3

Dijit将所有活动小部件存储在dijit.registry中，并使用id作为唯一限定符。您无法创建具有相同ID的dijits。

在创建新的滑块dijits之前需要清理dojo.registry。在test_slider.php

上声明dijit之前添加此代码

dijit.registry["input"+ [i]].destroyRecursive();

Answer 4

你可以指定任何数字ID，如由10位数字随机数生成的ID或具有日期时间组合的内容，因此id永远不会相同。

尝试注册id == valores0的widget，但该id已经注册

4 个答案: