0

I have a search box thats been working reliably until i had change to the latest version of jquery in my code. It displays fine, but you can't click into the box to type a search parameter in. Works fine with

https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

Here is a snippet of the code im calling.

My php:

  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
 .....
 <form id="search" method="post" action="tagsearch.php">&nbsp;&nbsp;
   <input name="tagsearch" type="text" size="40" placeholder="Search tags" />

the CSS:

    #search {

     }

#search input[type="text"] {
background: url(img/search-white.png) no-repeat 10px 6px #fcfcfc;
border: 1px solid #d1d1d1;
font: bold 12px Arial,Helvetica,Sans-serif;
color: #bebebe;
width: 150px;
padding: 6px 15px 6px 35px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
-webkit-transition: all 0.7s ease 0s;
-moz-transition: all 0.7s ease 0s;
-o-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
}

#search input[type="text"]:focus {
width: 200px;
outline:none; box-shadow:none;
}

Any ideas why this would not work with jquery-latest, but fine with the older version? I need the new version to use fancybox on my site.

3
  • "latest" seems to be pointing to 1.10.2. Have you tried http://code.jquery.com/jquery-1.11.0.min.js?
    – DevlshOne
    May 8, 2014 at 22:39
  • Actually it looks like 1.11.1 is the newest (Google CDN's haven't caught up yet :) http://code.jquery.com/jquery-1.11.1.min.js May 8, 2014 at 22:46
  • Check for error messages in your browser console — what do you see?
    – Terry
    May 9, 2014 at 14:59

1 Answer 1

1

The CSS wouldn't be effected by jQuery and the PHP doesn't show any JavaScript. There are substantial differences in jQuery from 1.7.2 to 1.11.1 that could break, but without seeing your JavaScript it would be hard to guess. My experience tells me it's probably in event binding.

jQuery moved away from .live() in favor of .on(). While I think the named event aliases like .click() and .submit() are still there it would help to move those as well (to .on("click", function() {}) and .on("submit", function() {})). If you add your JavaScript to your question it might be possible to spot the changes needed. Or you can add any errors that appear in your JavaScript console.

Also here is a migration guide for adjusting to changes made in 1.9 that might help:

http://jquery.com/upgrade-guide/1.9/

1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.