Question

我正在创建一个调查表单，当用户关注它们时，需要突出显示每个问题和一组答案（通过更改背景颜色）。 .focus（）和.blur（）都可以在Firefox和IE中使用，但在Safari和Chrome中不完全。我也尝试了.focusin（）和.focusout（），结果相同。 编辑：点击不会触发焦点事件，但是通过输入字段进行制表符。我说不完全因为它适用于文本输入，选择输入和textarea输入;但不是收音机和复选框输入。

$(document).ready(function()
 {
    $("form li").focusin(function()
  {
   $(this).addClass("over");
  }).focusout(function()
  {
     $(this).removeClass("over");
  });
 });

这适用于与此类似的html块：

<li>
    <label for="webmail" class="desc">Email</label>
    <input type="text" name="webmail" id="webmail" />
</li>
<li>
    <label for="business" class="desc">Purpose of your Charter Flight:</label>
    <div>
        <span>
            <input type="radio" name="purpose" id="business" class="radio" />
            <label class="choice" for="business">Business</label>
        </span>
        <span>
            <input type="radio" name="purpose" id="pleasure" class="radio" />
            <label class="choice" for="pleasure">Pleasure</label>
        </span>
    </div>
</li>

我尝试使用切换器，但我正在寻找一种更优雅的解决方案，不涉及使用复杂的逻辑来使其工作。有什么想法吗？

Answer 1

很久以前我也遇到过这个问题，奇怪的是它是一个单选按钮让我感到悲痛。

请尝试使用jQuery.change()，这是我遇到的问题的一个有效例子

$("input#zendesk-dropbox-askedbefore, input#zendesk-dropbox-newhere").change(function() {
    $("label#zendesk-dropbox-label-askedbefore, label#zendesk-dropbox-label-newhere").toggleClass('zendesk-dropbox-label-highlight');
});

如果我不清楚我疯狂使用ID名称，input#zendesk-dropbox-askedbefore＆amp; input#zendesk-dropbox-newhere都是单选按钮。

Answer 2

我昨晚在开车回家的时候想过这件事并且我自己想出来了，它可能不是最优雅的解决方案，但它确实有效。

$(document).ready(function()
    {
       $("textarea, input, select, .radio, .checkbox").click(function()
        {
            $("form li.over").toggleClass("over");
            $(this).parents("li").toggleClass("over");
        });
    });

非常感谢！

Answer 3

// In js area write following method
$('#chkRikin').focus(function() {
alert('Say Hi Rikin');
});


// in html area write following code anenter code hered test it your self
<input type="checkbox" onclick="this.focus()" onblur="yourMethod()" />

it works in google crom

jQuery .focus（）和.blur（）无法在Chrome或Safari中使用

3 个答案: