jQuery表单关注元素创建

时间:2010-02-27 22:14:08

标签: jquery focus

寻求jQuery代码的一些帮助。

我正在使用simplemodal plugin

创建一个模态框

我正在设法在元素的点击上创建一个模态框,其中包含一个表单....我希望表单在出现时能够专注于textarea字段,但我不确定如何实现这一点..

这是我目前的代码..

    $('#showModal a').live('click',(function(){
      // Build Modal Box Container And Add to Page      
        $('<div id="osx-modal-content">\
            <div id="osx-modal-title"><h2>Please explain this song.</h2></div>\
            <div id="osx-modal-data"> \
            <p class="loaderGif"> <img src="http://localhost:8500/mxRestore/images/ajax-loader.gif"> </p>\
         </div>\
         </div>').appendTo('body');

         //Set Modal Box Options                
        $("#osx-modal-content").modal({
                // OPTIONS SET HERE
                overlayClose:true,
                onOpen:OSX.open,
                onClose:OSX.close
            });

         // I have a hidden form on the page...grab its HTML!!
         var modalForm = $('#addTmWrapper').html();

         // Dynamically build a text area and add to the form...
         // The text area from my hidden form wont show properly for some reason.....maybe a coldfusion issue

         var textField= ''
         textField+= '<textarea name=' + '"sMessage"' + 'id="sMessages"' + 'cols="62"' + 'rows="3"' + 'class="textarea word_count">' + '</textarea>'

         // Add hidden form to modal box, add textarea to form..
         // Then show it                    
         $('#osx-modal-data').html(modalForm ).find('#addTmForm')
                .prepend(textField)
                .show();
    return false
}));

想知道当模态框出现时我怎么能让textarea有焦点?

感谢任何帮助,谢谢

5 个答案:

答案 0 :(得分:1)

要将焦点放在表单元素上,请使用focus()

$('#myElement').focus()

答案 1 :(得分:1)

试试这个:

var aSet = $('selector');
aSet[0].focus();
上面的焦点适用于Element而不是jQuery Object。

答案 2 :(得分:0)

return false;之前,添加$('#sMessages').focus();(请参阅jQuery docs)。

答案 3 :(得分:0)

使用

$('selector').trigger('focus');

而不是

$('selector').focus();

$(...)。focus(function(){})绑定一个函数来聚焦不做焦点的事件。)

答案 4 :(得分:0)

将其包裹在timeOut中以使其正常工作:完成here

setTimeout(function(){
    $('selector').focus();
}, 0);