1


我试图组织我的 jquery 代码，所以我创建了一个对象文字，但现在focusTextArea不起作用，我的 textarea 值没有更新。

谢谢你的帮助。

html

<textarea id="test"></textarea>​

javascript

(function($,window,document,undefined){

    var TEX = {

        inputField: $("textarea#test"),

        /* Init all functions */
        init: function()
        {
            this.focusTextArea();
        },

        /* Function update textarea */
        focusTextArea:  function()
        {
            this.inputField.text('test');
        },
    }

    $(document).ready(function(){
        TEX.init();
    });

})(jQuery,window,document);​

jsfiddle http://jsfiddle.net/vBvZ8/1/

4

2 回答 2

2

首先，您没有在小提琴中正确包含 jQuery。另外，我认为您的意思是将代码放在head文档中（因为document.ready处理程序）。

更重要的是，选择器可能在文档准备好之前$("textarea#test")运行，因此实际上不会正确找到元素。我建议分配：inputFieldTEX.init

(function($,window,document,undefined){

    var TEX = {

        /* Init all functions */
        init: function()
        {
            this.inputField = $("#test");
            this.focusTextArea();
        },

        /* Function update textarea */
        focusTextArea:  function()
        {
            this.inputField.text('test');
        },
    }

    $(document).ready(function(){
        TEX.init();
    });

})(jQuery,window,document);​

更新示例：http: //jsfiddle.net/xntA2/1/

作为旁注，textarea#test应更改为 just #test。该textarea位是多余的，因为页面上应该只有一个元素带有id=test.

于 2012-12-23T16:46:28.153 回答
0

避免在元素存在之前查找元素的替代语法是从函数中返回元素：

(function($,window,document,undefined){

    var TEX = {
        /* function won't look for element until called*/
        inputField:function(){
            return $("textarea#test")
       }, 
        init: function()
        {
            this.focusTextArea();
        },
        focusTextArea:  function()
        {
            this.inputField().text('test');
        },
    }

    $(document).ready(function(){
        TEX.init();
    });

})(jQuery,window,document);

演示：http: //jsfiddle.net/vBvZ8/5/

我意识到这是一个简化的例子......但你也非常接近创建一个 jQuery 插件，这也可能是有益的。以下提供与示例相同的功能：

(function($, window, document, undefined) {    
    $.fn.focusTextArea = function() {
        return this.each(function(){
            $(this).text('test');
        })        
    };    
})(jQuery, window, document);

$(function() {
    $('textarea').focusTextArea()
});

演示：http: //jsfiddle.net/vBvZ8/8/

于 2012-12-23T17:07:35.663 回答