jQuery 选择元素变量

发布于 2024-12-07 05:32:57 字数 780 浏览 0 评论 0原文

我一直无法找到答案：

我的 HTML（简化版）看起来与此类似（页面上有几个不同的控件：文本字段、组合框等）：

...
<input name="name" onfocus="showHint(this, 'Please enter your name')" onblur="hideHint()" ...>
...

javascript 函数中的 An showHint 我做了类似的事情：

function showFormEntryHint(control, text)
{
    localOffset = 30;
    $('#entry_hint').html(text);
    var position = $(control).offset();
    position.left += $(this).offset() + localOffset;
    position.top -= 5;
    $('#entry_hint').position(position);
    $('#entry_hint').fadeIn();
}

这个想法是将 #entry_hint div 放置在调用该函数的字段旁边。不幸的是，选择器 $(control) 似乎不起作用 - 并且它的 .offset() 总是返回 {left: 0, top: 0}.

知道如何让它发挥作用吗？非常感谢！

原文

I haven't been able to find an answer to this:

My HTML (simplified) looks similar to this (there are several different controls on the page: text fields, comboboxes, etc.):

...
<input name="name" onfocus="showHint(this, 'Please enter your name')" onblur="hideHint()" ...>
...

An in the javascript function showHint I do something like:

function showFormEntryHint(control, text)
{
    localOffset = 30;
    $('#entry_hint').html(text);
    var position = $(control).offset();
    position.left += $(this).offset() + localOffset;
    position.top -= 5;
    $('#entry_hint').position(position);
    $('#entry_hint').fadeIn();
}

The idea is to position the #entry_hint div next to the field that invoked the function. Unfortunately, selector $(control) does not seem to work - and .offset() on it always returns {left: 0, top: 0}.

Any idea how I can get this to work? Many thanks!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

烟火散人牵绊 2024-12-14 05:32:57

无论如何，你都在使用 jQuery；为什么坚持使用 DOM0 风格的事件处理程序？

这样做：

<!-- simplified -->
<input id='someInput' />

<script type='text/javascript'>
jQuery(function($) {

    // this is where we attach the event handlers
    $('input#someInput')
    .focus(function() {
        showFormEntryHint(this, 'Please enter your name.');
    })
    .blur(function() {
        hideHint();
    });
});
</script>

但是，除此之外，如果您不需要太多自定义逻辑，您也可以寻找现成的插件来为您完成主要工作。

You're using jQuery anyway; why stick to DOM0-style event handlers?

Do it like this:

<!-- simplified -->
<input id='someInput' />

<script type='text/javascript'>
jQuery(function($) {

    // this is where we attach the event handlers
    $('input#someInput')
    .focus(function() {
        showFormEntryHint(this, 'Please enter your name.');
    })
    .blur(function() {
        hideHint();
    });
});
</script>

Barring that however, you can also look for ready-made plugins to do the brunt work for you if you don't need much custom logic.

回复收藏 0 原文