Question

我正在开发一个我想使用jquery的项目，但是我们发现它必须写入 dojo ，我之前从未使用过它并且正在使用它麻烦在线阅读如何使用它。

以下是我使用的代码：

<script>
        window.onload = function() {
            getManager($("#team_name").val());  
        }

        function getManager(team) {
            $.ajax({
                type: "POST",
                url: "getManager.php",
                data: {team:team}
            }).done(function( manager ) {
                $("#manager_name").val(manager);
            });
        }
</script>

基本上，有一个下拉<selection>字段，当选中时（加载窗口时），它应根据列出的团队预填充其下方的只读框。请参阅以下屏幕截图以获得更好的主意：

screenshot http://i41.tinypic.com/2mmcu34.png

我上面的代码可以正常使用jquery，我似乎无法找到 dojo 的等价物。

这是选择字段的html：

<select name="team" id="team_name" onchange="getManager(this.value)" type="text" readonly>

这是文字输入字段的html代码：

<input name="manager_name" id="manager_name" type="text" readonly/>

代码必须在页面的其余部分写入dojo ，除非有办法用jquery覆盖dojo？

Answer 1

window.onload = function() {
    getManager(document.getElementById('team_name').value);  
}

function getManager(team) {
    require(["dojo/_base/xhr"], function(xhr){
        xhr.post({
            url:"getManager.php",
            timeout: 4000,
            content: { team:team },
            load: function( manager ){
                document.getElementById("#manager_name").value = manager;
            }
        });
    });
}

Answer 2

如果你正在使用dojo 1.7及以上版本，则无需使用window.onload（）甚至dojo.addOnLoad（） - 我认为这就是你要找的东西

require(['dojo/dom', 'dojo/domReady!', function(dom) {
  getManager(dom.byId('team_name').value); 
});


function getManager(team) {
  require(['dojo/request/xhr', 'dojo/dom'], function(xhr, dom) {
    xhr.post('getManager.php', {
      method: 'POST',
      data: {team: team}
    }).then(function(manager) {
        dom.byId('manager_name').value = manager;
    }, function(error) {
        console.error('couldn\'t fetch manger!');
    });
  });
}

domReady! - 是一个AMD加载的插件，它会等到DOM完成加载才会返回

Dojo等效于以下jquery代码

2 个答案: