0
让jQuery和Prototype一起工作有点麻烦。 错误控制台抛出一个错误Javascript ajax邮件和scriptaculous冲突
$(divid).visible is not a function
我的旧的原型是在
function toggleDisplayWait(divId, imgId, durationmSec) {
if(!$(divId).visible())
{
move = Effect.BlindDown;
newImage = "./img/minus.png";
}
else {
move = Effect.BlindUp;
newImage = "./img/plus.png";
}
move(divId, {duration: durationmSec/1000.0 });
setTimeout(function() { $(imgId).src = newImage; }, durationmSec)
}
而且我的新的jQuery三个变化我在教程中是
// Init the form once the document is ready
jQuery(init);
// Initialize the form
function init() {
// Hide the form initially.
// Make submitForm() the forms submit handler.
// Position the form so it sits in the centre of the browser window.
jQuery('#contactForm').hide().submit(submitForm).addClass('positioned');
// When the "Send us an email" link is clicked:
// 1. Fade the content out
// 2. Display the form
// 3. Move focus to the first field
// 4. Prevent the link being followed
jQuery('a[href="#contactForm"]').click(function() {
jQuery('#content').fadeTo('slow', .2);
jQuery('#contactForm').fadeIn('slow', function() {
jQuery('#senderName').focus();
})
return false;
});
// When the "Cancel" button is clicked, close the form
jQuery('#cancel').click(function() {
jQuery('#contactForm').fadeOut();
jQuery('#content').fadeTo('slow', 1);
});
// When the "Escape" key is pressed, close the form
jQuery('#contactForm').keydown(function(event) {
if (event.which == 27) {
jQuery('#contactForm').fadeOut();
jQuery('#content').fadeTo('slow', 1);
}
});
}
// Submit the form via Ajax
function submitForm() {
var contactForm = jQuery(this);
// Are all the fields filled in?
if (!jQuery('#senderName').val() || !jQuery('#senderEmail').val() || !jQuery('#message').val()) {
// No; display a warning message and return to the form
jQuery('#incompleteMessage').fadeIn().delay(messageDelay).fadeOut();
contactForm.fadeOut().delay(messageDelay).fadeIn();
} else {
// Yes; submit the form to the PHP script via Ajax
jQuery('#sendingMessage').fadeIn();
contactForm.fadeOut();
jQuery.ajax({
url: contactForm.attr('action') + "?ajax=true",
type: contactForm.attr('method'),
data: contactForm.serialize(),
success: submitFinished
});
}
// Prevent the default form submission occurring
return false;
}
// Handle the Ajax response
function submitFinished(response) {
response = jQuery.trim(response);
jQuery('#sendingMessage').fadeOut();
if (response == "success") {
// Form submitted successfully:
// 1. Display the success message
// 2. Clear the form fields
// 3. Fade the content back in
jQuery('#successMessage').fadeIn().delay(messageDelay).fadeOut();
jQuery('#senderName').val("");
jQuery('#senderEmail').val("");
jQuery('#message').val("");
jQuery('#content').delay(messageDelay+500).fadeTo('slow', 1);
} else {
// Form submission failed: Display the failure message,
// then redisplay the form
jQuery('#failureMessage').fadeIn().delay(messageDelay).fadeOut();
jQuery('#contactForm').delay(messageDelay+500).fadeIn();
}
}
我用了没有冲突,并改变了我的$ jQuery,但没有喜悦。剧本的开始是
<script src="java/prototype.js" type="text/javascript"></script>
<script src="java/scriptaculous.js" type="text/javascript"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script> jQuery.noConflict() </script>
<script type="text/javascript"> var messageDelay = 3000; // How long to display status messages (in milliseconds) </script>
<script type="text/javascript" language="javascript">
它看起来像你的原型脚本实际上非常小 - 如果你在两个库之间有冲突,我建议通过jQuery来转换你的原型脚本。 –
为什么你包含jQuery两次?你有'jquery-latest.js'和'jquery.min.js' - 选一个。 – nnnnnn