Wie fügen Sie ASP.NET Web Forms-Seiten den jQuery-UI-Code hinzu?

Wenn Sie auf Neu> Web Forms in einem ASP.NET Web Forms-Projekt auswählen, erhalten Sie eine Seite mit diesem Code:Wie fügen Sie ASP.NET Web Forms-Seiten den jQuery-UI-Code hinzu?

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DuckbilledPlatypus.aspx.cs" 
Inherits="DuckbilledPlatypus" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 

    </div> 
    </form> 
</body> 
</html>

jQuery-Code hinzufügen kein Zweifel die gleiche Art und Weise getan ist wie es typisch ist (wie in Razor/Webseiten apps/sites) referenzieren Sie die notwendigen jQuery und jQueryUI * .js und * .css Dateien, und fügen Sie dann die jQuery in einem Skriptelement hinzu.

jedoch die zur Verfügung gestellten Formulare/Seiten ("About" und "Kontakt") haben diese Art von Code:

<%@ Page Title="About" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" 
CodeFile="About.aspx.cs" Inherits="About" %> 

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"> 
    <h2><%: Title %>.</h2> 
    <h3>Your application description page.</h3> 
    <p>Use this area to provide additional information.</p> 
</asp:Content>

Wie wird Code jQuery/jQueryUI solche hinzugefügt? Können die * .js- und * .css-Verweise sowie der Skriptabschnitt einfach innerhalb der asp: Content-Verkapselung hinzugefügt werden?

Quelle

2013-10-28 B. Clay Shannon

Dies ist, wie ich meine zu tun ..

<script src="Scripts/jquery-ui-1.10.3.min.js"></script> 
<script src="Plugins/jquery.cookie.js"></script> 
<link href="Content/themes/Smoothness/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" /> 
<script> 
    /** 
     *This script creates a cookie that expires every 7 days. If you don't have this cookie 
     *then the popup shows. If the cookie isn't expired, the popup doesn't show. 
    **/ 
    $(document).ready(function() { 
     if ($.cookie('modal_shown') == null) { 
      $.cookie('modal_shown', 'yes', { expires: 7, path: '/' }); 
      $('#popup').dialog({ 
       modal: true, 
       buttons: { 
        Ok: function() { 
         $(this).dialog("close"); 
        } 
       } 
      }); 
     } 
    }); 
</script> 
<div id="popup" style="display: none" title="New Release!"> 
    <span class="ui-icon-alert" style="float: left; margin: 0 7px 50px 0;"></span> 
    <p><b>Issues Resolved</b></p> 
    <ul> 
     <li>New thing 1</li> 
     <li>New thing 2</li> 
     <li>New thing 3</li> 
    </ul> 
</div> 
<h2><%: Title %>.</h2> 
<h3>Your application description page.</h3> 
<p>Use this area to provide additional information.</p>

Dies ist die eine der Master-Seite mit.

Für das Web-Formular einer Masterseite nicht verwenden, Sie werden es tun, wie ..

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DuckbilledPlatypus.aspx.cs" 
Inherits="DuckbilledPlatypus" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<script src="Scripts/jquery-2.0.2.min.js"></script> 
    <script src="Scripts/jquery-ui-1.10.3.min.js"></script> 
    <script src="Plugins/jquery.cookie.js"></script> 
    <link href="Content/themes/Smoothness/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" /> 
    <script> 
     /** 
      *This script creates a cookie that expires every 7 days. If you don't have this cookie 
      *then the popup shows. If the cookie isn't expired, the popup doesn't show. 
     **/ 
     $(document).ready(function() { 
      if ($.cookie('modal_shown') == null) { 
       $.cookie('modal_shown', 'yes', { expires: 7, path: '/' }); 
       $('#popup').dialog({ 
        modal: true, 
        buttons: { 
         Ok: function() { 
          $(this).dialog("close"); 
         } 
        } 
       }); 
      } 
     }); 
    </script> 
    <div id="popup" style="display: none" title="New Release!"> 
     <span class="ui-icon-alert" style="float: left; margin: 0 7px 50px 0;"></span> 
     <p><b>Issues Resolved</b></p> 
     <ul> 
      <li>New thing 1</li> 
      <li>New thing 2</li> 
      <li>New thing 3</li> 
     </ul> 
    </div> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 

    </div> 
    </form> 
</body> 
</html>

Wie Sie sehen können, würden Sie im Tag legen du es einfach. Ich hoffe das hilft!

Quelle

2013-10-28 19:12:01 Humpy

Ist viel besser das 'Skript' auf der Unterseite auf der Seite, Es ist eine gute Übung. –

Ihr zweites Snippet verwendet eine Masterseite. Sie könnten die Skriptreferenzen innerhalb der asp:content Tags hinzufügen, aber es wäre wahrscheinlich besser/einfacher, stattdessen die Verweise auf die Masterseite hinzuzufügen.

Quelle

2013-10-28 19:03:58

Auch wenn ich nur jQuery/jQueryUI auf der einen Seite verwende? –

Wenn Sie es wirklich nur auf einer Seite verwenden, können Sie auf die Skripts in den Inhalts-Tags auf dieser Seite verweisen. Beachten Sie, dass das mehrfache Hinzufügen von Verweisen auf jquery auf einer Seite zu Problemen führen kann. Wenn Sie später entscheiden, es zur Musterseite hinzuzufügen, wird es möglicherweise auf dieser Seite nicht mehr funktionieren, bis Sie die Verweise von dieser Seite entfernen. –

Wie fügen Sie ASP.NET Web Forms-Seiten den jQuery-UI-Code hinzu?

Antwort

Verwandte Themen