0

我已经下载并设置了 jQuery 照明（http://www.tonylea.com/2011/jquery-illuminate/）
我确保 jQuery 和照明插件都加载到页面中。

然后我这样编码

Javascript 部分

window.onload = function(){
            if(document.URL.indexOf("mode=1") >= 0){ 

                    var input = $(".box#input");
                    $(document).scrollTop(input .offset().top - 60);
                    var v = input.val();
                    input.val('');
                    input.focus().val(v);
                    input.focus()

                    $(".btn#illuminate").illuminate({
                        'intensity': '0.3',
                        'color': '#98cb00',
                        'blink': 'true',
                        'blinkSpeed': '1200',
                        'outerGlow': 'true',
                        'outerGlowSize': '30px',
                        'outerGlowColor': '#98cb00'
                    });

            }
}

表格部分

<div class="chat">
    <form accept-charset="UTF-8" action="/comments" class="new_comment" data-remote="true" id="new_comment" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input name="authenticity_token" type="hidden" value="GujuDnihu2UXCbJgbooDxoikjcJncFLf8hl4=" /></div>
        <div class="input-append">
            <input class="box" id="input" name="comment[body]" type="text" value="Hello there" />
            <button type="submit" class="btn" id="illuminate">submit</button>
        </div>
    </form> 
</div>

但是，提交按钮不会亮起。
我看到错误提示e.css(...) is undefined illuminate.js
为什么？我怎样才能解决这个问题？

4

1 回答 1

2

上面的其他用户已经提到可以更改一些选择器，因此$(".box#input");您可以使用而不是使用，$("#input");因为页面中的 id 必须是唯一的，因此.box不需要额外的类选择器。如果选择器是导致错误的原因，我在 chrome 开发工具中进行了测试，但至少在 chrome 30 中这并不重要。

我原封不动地复制了您的 html 并在本地运行它 - 它按预期工作，按钮会发光。

然后我在 plnkr.co 创建了一个在线演示 plunk，只更改了一些内容：

  1. div的嵌套
  2. 删除document.URL.indexOf("mode=1") >= 0，使其适用于任何 url

所以这是html

<div>
<form accept-charset="UTF-8" action="/comments" class="new_comment" 
    data-remote="true" 
    id="new_comment" method="post">
    <div class="chat">
      <input name="utf8" type="hidden" value="&#x2713;" />
      <input name="authenticity_token" type="hidden" 
          value="GujuDnihu2UXCbJgbooDxoikjcJncFLf8hl4=" />
    </div>
    <div class="input-append">
        <input class="box" id="input" name="comment[body]" 
               type="text" value="Hello there" />
        <button type="submit" class="btn" 
               id="illuminate">submit</button>
    </div>
</form> 
</div>

它似乎工作得很好。让我知道它是否按预期工作。错误一定在其他地方。

  • 您使用的是什么版本的 jquery、jquery-ui 和Illumina？

更新：来自我们聊天的信息

我理解了以下内容：

下一步是包含对 jquery-ui.min.js 的引用，并查看它是否与 bootsrap 一起使用。

更新 2：jQuery 照明与 jQuery 1.9.1 一起使用

使用jQuery 1.9.1的Illumination 0.7插件需要修改版本的Illumination 0.7

于 2013-08-04T07:14:21.123 回答