论坛 › 知识问答 › jquery - 结合 jQuery 函数

菜鸟教程小白 发表于 2022-12-12 22:09:21

jquery - 结合 jQuery 函数

                                            <p><p>我在组合几个 jQuery 函数时遇到了麻烦。任何帮助表示赞赏。每个脚本单独工作，但是当我尝试将它们组合在一起时，只有一个工作(iOS 悬停)，我不知道为什么。我正在为 iOS 设备上的问题做一些解决方法。我想在第一个函数中包含第二个我似乎做不到的函数。</p>

<p>只要注释掉第二个函数，第一个函数就可以正常工作:</p>

<pre><code>$(document).ready (function(){
/**iOS phone number fix for text color**/
$(&#34;.phone #phonenumber&#34;).remove();
$(&#34;.phone&#34;).append(&#34;&lt;div id=&#39;phonenumber2&#39;&gt;&lt;span class=&#39;callustext&#39;&gt;Call us :(800) 000-0000&lt;/span&gt;&lt;/div&gt;&#34;);
/**iPad fixes for subnav styling at 768px**/
if(screen.width == 768){
    $(&#34;#innerpage .mainnav ul li ul&#34;).css(&#34;background&#34;,&#34;transparent&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink a:hover&#34;).css(&#34;color&#34;,&#34;#91b39e&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlinkactive a:hover&#34;).css(&#34;color&#34;,&#34;#91b39e&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink ul li a&#34;).css(&#34;border-bottom&#34;,&#34;none&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlinkactive ul li a&#34;).css(&#34;border-bottom&#34;,&#34;none&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink ul li a:link&#34;).css(&#34;text-transform&#34;,&#34;none&#34;).css(&#34;color&#34;,&#34;#d7d7d7&#34;);
}
});
</code></pre>

<p>当第一个被注释掉时，第二个函数可以正常工作:</p>

<pre><code>/**iOS Hover fix**/
$(document).ready(function() {
   if(navigator.platform == &#34;iPad&#34;) {
   $(&#34;a&#34;).each(function() {
       var onClick; // this will be a function
       var firstClick = function() {
         onClick = secondClick;
         return false;
       };
       var secondClick = function() {
         onClick = firstClick;
         return true;
       };
       onClick = firstClick;
       $(this).click(function() {
         return onClick();
       });
   });
   }
});
</code></pre>

<p>引用:<a href="https://stackoverflow.com/questions/5507964/ios-automatic-hover-fix" rel="noreferrer noopener nofollow">iOS automatic hover fix?</a> </p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p><code>$(document).ready</code> 是一个在文档加载完成时调用的函数。如果你定义一个函数两次，第二个定义会覆盖第一个。所以你必须创建一个包含所有内容的单个 - 尝试</p>

<pre><code>$(document).ready (function(){
/**iOS phone number fix for text color**/
$(&#34;.phone #phonenumber&#34;).remove();
$(&#34;.phone&#34;).append(&#34;&lt;div id=&#39;phonenumber2&#39;&gt;&lt;span class=&#39;callustext&#39;&gt;Call us :(800) 000-0000&lt;/span&gt;&lt;/div&gt;&#34;);
/**iPad fixes for subnav styling at 768px**/
if(screen.width == 768){
    $(&#34;#innerpage .mainnav ul li ul&#34;).css(&#34;background&#34;,&#34;transparent&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink a:hover&#34;).css(&#34;color&#34;,&#34;#91b39e&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlinkactive a:hover&#34;).css(&#34;color&#34;,&#34;#91b39e&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink ul li a&#34;).css(&#34;border-bottom&#34;,&#34;none&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlinkactive ul li a&#34;).css(&#34;border-bottom&#34;,&#34;none&#34;);
    $(&#34;#innerpage .mainnav ul li.mainnavlink ul li a:link&#34;).css(&#34;text-transform&#34;,&#34;none&#34;).css(&#34;color&#34;,&#34;#d7d7d7&#34;);
}
if(navigator.platform == &#34;iPad&#34;) {
   $(&#34;a&#34;).each(function() {
       var onClick; // this will be a function
       var firstClick = function() {
         onClick = secondClick;
         return false;
       };
       var secondClick = function() {
         onClick = firstClick;
         return true;
       };
       onClick = firstClick;
       $(this).click(function() {
         return onClick();
       });
   });
   }
});
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于jquery - 结合 jQuery 函数，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/23410322/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/23410322/
                                                        </a>
                                                </p>
                                       

查看完整版本: jquery - 结合 jQuery 函数