Cómo usar jquery correctamente en el elemento web de SharePoint - jquery no siempre se activa

Question

Estoy aprendiendo a usar jquery con SharePoint. Mi ejemplo dibuja un cuadro rojo dentro del elemento web Editor de contenido cuando se selecciona un enlace. Mi código funciona cuando la página de SharePoint está en modo de edición, pero no después de que he salido de la página y regresé en modo no editable. La función jquery no se dispara por alguna razón ... Me falta algo simple pero no estoy seguro de qué.

Gracias por cualquier ayuda.

Kevin

Mi página principal del sitio web se conecta al archivo jquery-1.3.2.min.js esta manera:

<SharePoint:ScriptLink language="javascript" name="jquery-1.3.2.min.js" 
Defer="true" runat="server"/> 

Mi Contenido editor de código de elementos Web se ve así:

<style type="text/css"> 
#box 
{ 
    background: red; 
    width: 300px; 
    height: 300px; 
    display: none; 
} 
</style> 


<script type ="text/javascript"> 
    $(function() { 
     $('a').click(function() { 
      $('#box').slideDown(2000); 
     }); 
    }) 
</script> 

<div id="box"> 
<h1>This is text in the box</h1> 
</div> 
<a href="#">Display Box</a><br /> 

Answer 1

Compruebe el código HTML procesado para el control ScriptLink y vea si puede buscar la ubicación indicada por la etiqueta de script >. Esto debería darte algunas ideas sobre lo que está pasando mal.

Además, eche un vistazo a this question que contiene opciones para agregar jQuery a SharePoint. (Descargo de responsabilidad: una de las respuestas es mía y el método que uso actualmente.)

Answer 2

El principal problema con el código JavaScript que no se activa cuando se carga una página es que toda la página puede no haber terminado de cargarse y por lo tanto el DOM interno puede no haber sido completamente construido aún.

La mejor manera de arreglar esto es conectar el código al evento de carga o preparado.

Por ejemplo

<script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 

<script language="javascript"> 
function doSomething() 
{ 
    // Your code goes here 
} 

jQuery.event.add(window, "ready", doSomething); 
</script> 

Para ejemplos detallados sobre cómo utilizar este en SharePoint, ver http://www.muhimbi.com/blog/2009/07/massage-sharepoint-into-submission.html y http://www.muhimbi.com/blog/2009/07/automatically-add-search-as-you-type-to.html

Answer 3

Recientemente me he encontrado con un problema que creo que puede ayudar a alguien.

En etiqueta de la cabeza de SharePoint si se coloca la etiqueta de secuencia de comandos como

<script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"/> 

continuación, jQuery no está funcionando, pero si se coloca como

<script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 

ver la diferencia </script> entonces está trabajando.

¡Estoy sorprendido!

Answer 4

Creo que es un problema de tiempo. Prueba esto. Agregue LoadAfterUI = "true"

<SharePoint:ScriptLink ID="SPScriptLink" runat="server" LoadAfterUI="true" Localizable="false" Name="sp.js"> 
</SharePoint:ScriptLink>