0

我正在尝试制作一个允许人们一次编辑一个字段并保存它的 AJAX 页面。该页面是通过 AJAX 加载制作的，所以我不知道所有字段和 DIV 提交 ID 名称。

但他们的想法是他们编辑一个字段，按回车键（或单击保存），它使发送 DIV 的 ID 的功能变得有趣。

因此，如果有人通过标签，onfocus 将调用该函数，这不是我想要的。并且只有在单击时才会运行 onclick，而我不能这样做 foundNode.click(); 所以它对treatenterastab的想法并没有真正的帮助。

有人可以提供建议吗？

谢谢格雷格

       <head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.5.0/dojo/dojo.xd.js" djConfig="parseOnLoad: true"></script>

<script type="text/javascript">
// Show and Hide the input element
function ShowHideFields(objName){
  dojo.query("." + objName).forEach(function(node, index, arr){
            console.debug(node.innerHTML);

        var myTextField = dojo.byId(node);
        if(myTextField.style.display == "none") {
            myTextField.style.display = "block";
        } else {
            myTextField.style.display = "none";     
        }

 });
}


// allow edit and save  the data
    function Edit(id)  {
        var task = id.substr(0, 4)
        var id = id.substr(4)
        if (task == "COMM"){
            if(dojo.byId('discom' + id).style.display == 'none'){
                dojo.byId('discom' + id).style.display = 'block';
                dojo.byId('edicom' + id).style.display = 'none';
                dojo.byId('COMM' + id).innderHTML = 'edit';
                EditSave('discom' + id , 'edicom' + id, id );
            } else if (dojo.byId('discom' + id).style.display == 'block') {
                dojo.byId('discom' + id).style.display = 'none';
                dojo.byId('edicom' + id).style.display = 'block';
                dojo.byId('COMM' + id).innerHTML= 'save';
            }
        } else if (task == "NAME"){
            if(dojo.byId('disnam' + id).style.display == 'none'){
                dojo.byId('disnam' + id).style.display = 'block';
                dojo.byId('edinam' + id).style.display = 'none';
                dojo.byId('NAME' + id).innerHTML = 'edit';
                EditSave('disnam' + id , 'edinam' + id, id );
            } else if (dojo.byId('disnam' + id).style.display == 'block') {
                dojo.byId('disnam' + id).style.display = 'none';
                dojo.byId('edinam' + id).style.display = 'block';
                dojo.byId('NAME' + id).innerHTML = 'save';
            }

        }
    }

    function EditSave(destination, source, id ){
        //AJAX here, but for the sake of example this will work.
        if(dojo.byId(destination) )   {
            dojo.byId(destination).innerHTML = dojo.byId(source).value; 
}
    }



// capture the enter, and make it a tab to execute
function treatEnterAsTab(evt) {
    if (evt.keyCode == dojo.keys.ENTER) {
        var formElements = null;
        if (formElements = dojo.query('*')) {
            var foundNode = false;
            for (var i = 0; i < formElements.length; i++) {
                if (evt.target == formElements[i] && formElements[(i + 1)]) {
                    nextNode = formElements[(i + 1)];
                    foundNode =  formElements[(i + 1)];      
                    break;
                }
            }
            if (foundNode && foundNode.focus) {
                //set focus, but really set Click would be better.. Any ideas?
                foundNode.focus();

            }
        }
    }
}

// connect the key press event to the input boxes
dojo.addOnLoad(function(){
    dojo.query("input").forEach(function(node, index, arr){
        dojo.connect(dojo.byId(node),"keypress", treatEnterAsTab);
    });
});

</script>

</head>

<body>

    <div style="position: relative; float: left;">
        <b style="float:left;">My Comment:</b><div id="disnam001" style="float:left; display: block;" > My Comment Here</div><input style="display:none; float:left;" id="edinam001" type="text" name="edinam001" value=" My Comment Here"/>
        <div tabindex="0" onfocus="Edit(this.id);"  id="NAME001" style="position: relative; float: right; margin-left: 10px; cursor:pointer;  height:16px;  padding: 0px 0px 0px 20px;" >edit</div>
    </div>


</body>
4

1 回答 1

0

关于焦点事件，您可以防止事件冒泡以及执行它的默认操作。换句话说，您可以捕获焦点事件并让它执行您喜欢的任何动作（或非动作）。你问题的另一部分的答案是相似的。

我个人不使用除我自己之外的任何 JavaScript 库，因此我无法在 dojo 或您可能使用的任何其他库的上下文中为您提供帮助，因为我对它们没有任何经验。

也许你能再次阐明围绕手头问题的背景来帮助我可怜的大脑？;-)

于 2010-09-07T02:56:24.977 回答