2010-10-08 10 views
0

J'ai un contrôle de vue arborescente construire dynamiquement. je veux changer la couleur du noeud sélectionné .one aidez-moi à écrire le script ci-dessous. et son travail bien.Javascript - Définir le fichier source et assigner la valeur à un contrôle

<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load("jquery", "1.4.2"); 
    google.setOnLoadCallback(function() { 
     //change cursor to hand when user mouseover tree nodes 
     $(".TreeView1_0").mouseover(function() { 
      $(this).css('cursor', 'pointer'); 
     }); 


     //unbold all nodes then bold the selected node to indicate it's selected 
     $(".TreeView1_0").click(function() { 
      $(".TreeView1_0").css('font-weight', 'normal'); 
      $(".TreeView1_0").css('color', 'black'); 
      $(".TreeView1_0").css('background-color', 'white'); 


      $(this).css('color', 'white'); 

      $(this).css("background-color", "blue"); 

     }); 
    }); 
</script> 

Maintenant, je veux changer le fichier source dans le fichier js stocké dans l'index de noeud magasin script folder.And sélectionné et valeur fields.i cachés ont un JQuery1.4.1.js fichier source dans le dossier de script. Je ne sais pas quelle est la façon exacte de faire référence à ce fichier js. et je ne sais pas comment récupérer l'index de noeud sélectionné et la valeur

j'ai changé le code pour faire that.The tout le code ASPX est illustré ci-dessous

<% @ Page Language = "C#" AutoEventWireup = "true" CodeFile = "Default.aspx.cs" Inherits = "_Par défaut"%> <! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // FR" "http://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd ">

< html xmlns =" ​​http://www.w3.org/1999/xhtml "> < id = tête" Head1" runat = "server"> < title> </title>

<script type="text/javascript" src="../../Scripts/JQuery1.4.1.js"></script> 
    <script type="text/javascript"> 


     //change cursor to hand when user mouseover tree nodes 
     $(".TreeView1_0").mouseover(function() { 
      $(this).css('cursor', 'pointer'); 
     }); 


     //unbold all nodes ,then bold the selected node to indicate it's selected ,and store selected node index and value to two hidden fields 
     $(".TreeView1_0").click(function() { 
      $(".TreeView1_0").css('font-weight', 'normal'); 
      $(".TreeView1_0").css('color', 'black'); 
      $(".TreeView1_0").css('background-color', 'white'); 
      $(this).css('color', 'white'); 
      $(this).css("background-color", "blue"); 

      // i am not sure about the two lines of code given below 
      document.getElementById('hfvalue').value = $(this).value; 
      document.getElementById('hfindex').value =$(this).index; 

      $(this).css('color', 'white'); 

      $(this).css("background-color", "blue"); 

     }); 

</script> 

</head>

corps <>

<form id="form1" runat="server"> 
<div> 
    <asp:TreeView ID="TreeView1" runat="server"> 
    </asp:TreeView> 
</div> 
<p> 
    <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" /> 
    <asp:HiddenField ID="hfvalue" runat="server" /> 
    <asp:HiddenField ID="hfindex" runat="server" /> 
</p> 
</form> 

</body> </html>

Mais le code est travail . Je suis un débutant. Toutes les suggestions

Répondre

1

Je suppose que vous devez d'abord apporter une petite modification à votre script. Consultez l'extrait ci-dessous pour utiliser document.ready -

$(document).ready(function(){

//change cursor to hand when user mouseover tree nodes 

    $(".TreeView1_0").mouseover(function() { 

     $(this).css('cursor', 'pointer'); 

    }); 

    //unbold all nodes ,then bold the selected node to indicate it's selected ,and store selected node index and value to two hidden fields 

    $(".TreeView1_0").click(function() { 

     $(".TreeView1_0").css('font-weight', 'normal'); 

     $(".TreeView1_0").css('color', 'black'); 

     $(".TreeView1_0").css('background-color', 'white'); 

     $(this).css('color', 'white'); 

     $(this).css("background-color", "blue"); 

    // i am not sure about the two lines of code given below 

     document.getElementById('hfvalue').value = $(this).value; 

     document.getElementById('hfindex').value =$(this).index; 

     $(this).css('color', 'white'); 

     $(this).css("background-color", "blue"); 

    }); 

});

En outre, s'il vous plaît assurez-vous que le script jquery ne se ramassa correctement, et le chemin que vous utilisez est approprié. Une façon simple de vérifier est de taper la commande suivante dans la barre d'adresse et de voir si l'alerte montre une fonction

javascript:alert($)

+0

j'ai essayé en ajoutant $ (document) .ready (function(). mais son donnant une erreur -> erreur d'exécution Microsoft JScript: objet attendu –

+0

Cela signifie que votre chemin de script n'est pas correct. Avez-vous vérifié en utilisant javascript: alert ($), comme suggéré ci-dessus? – Kartik

+0

ouais. comment puis-je affecter la valeur de noeud et l'index sélectionnés aux champs cachés? document.getElementById ('hfvalue'). value = $ (this) .value; document.getElementById ('hfindex'). value = $ (this) .index; est-ce un moyen correct? .thanks –