0

私のasp.netページでJqueryUIからの単純な「アコーディオン」スクリプトを機能させることができません.aspx

これらの状況でのアコーディオンに関する適切なドキュメントが見つかりません。単純なhtmlのみです<p><h3><div> etc...

たとえば、これはaspxページ上の私のコードです:

<%@ Page Language="C#" MasterPageFile="~/Zulcon_ppal.Master" AutoEventWireup="true"    CodeBehind="EnvianosTuCurriculum.aspx.cs" Inherits="Grupo_Zulcon.EnvianosTuCurriculum" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function() {
$( "#accordion" ).accordion({
  heightStyle: "content"
});
});
</script>
<style type="text/css">
.curriculumContainer
{
width:90%;
color:#646464;
margin:30px auto;
}     and then more page specific css... </asp:Content>

次に、タイトルで試してみたいのです<div>が、何も起こりません:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<div class="fixed-width-wrapper contentContainer">

<div style="padding:20px">
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc; background-image:url('images/menuzulcon3.png'); height: 59px; width: 953px;" class="titulosGeneral";></div>
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Bachillerato</div>
  <div class="curriculumdivcompleto">
  <div id="accordion">
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Lugar (Ciudad, Pais)</div>
    <div style="margin-top:5px"><asp:TextBox ID="Lugar_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistro2">
    <div style="margin-top:10px" class="autenticacionTitulo">Nombre de la Institución</div>
    <div style="margin-top:5px"><asp:TextBox ID="Insti_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Año titulación</div>
    <div style="margin-top:5px"><asp:TextBox ID="año_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistro2">
    <div style="margin-top:10px" class="autenticacionTitulo">Años cursados</div>
    <div style="margin-top:5px"><asp:TextBox ID="cursados_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div>&nbsp;</div>
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Formación Superior</div>
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Lugar (Ciudad, Pais)</div>
    <div style="margin-top:5px"><asp:TextBox ID="Lugar_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistro2">
    <div style="margin-top:10px" class="autenticacionTitulo">Nombre de la Institución</div>
    <div style="margin-top:5px"><asp:TextBox ID="Nombre_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Titulo obtenido</div>
    <div style="margin-top:5px"><asp:TextBox ID="titulo_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq2">
    <div style="margin-top:10px" class="autenticacionTitulo">Año de titulación</div>
    <div style="margin-top:5px"><asp:TextBox ID="año_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq3">
    <div style="margin-top:10px" class="autenticacionTitulo">Semestres cursados</div>
    <div style="margin-top:5px"><asp:TextBox ID="Semestre_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
  </div>
</div>
  </div>
    <div style="text-align:right; margin-top:20px"><asp:Button ID="Button3" runat="server" ValidationGroup="Curriculum" postbackurl="Envia4.aspx" OnClick="Register" CssClass="my_btn"/></div>
  </div>
  </div>

</asp:Content>

私が何か間違っているかどうかはわかりませんが、誰かがこれに光を当てることができますか?

前もって感謝します。

4

1 に答える 1

1

あなたが探しているものであれば、ドキュメントページでこれを見つけました

アコーディオン コンテナーのマークアップには、ヘッダーとコンテンツ パネルのペアが必要です。

<div id="accordion">
<h3>First header</h3>
<div>First content panel</div>
<h3>Second header</h3>
<div>Second content panel</div>
</div>

アコーディオンは任意のマークアップをサポートしますが、各コンテンツ パネルは常に、関連付けられたヘッダーの次の兄弟でなければなりません。カスタム マークアップ構造の使用方法については、ヘッダー オプションを参照してください。

更新:

<div class="fixed-width-wrapper contentContainer">

<div style="padding:20px">
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc; background-image:url('images/menuzulcon3.png'); height: 59px; width: 953px;" class="titulosGeneral";></div>
  <div class="curriculumdivcompleto">
  <div id="accordion">
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Bachillerato</div>
  <div>
    <div class="curriculumLadoRegistroizq">
      <div style="margin-top:10px" class="autenticacionTitulo">Lugar (Ciudad, Pais)</div>
      <div style="margin-top:5px"><asp:TextBox ID="Lugar_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
    </div>
    <div class="curriculumLadoRegistro2">
      <div style="margin-top:10px" class="autenticacionTitulo">Nombre de la Institución</div>
      <div style="margin-top:5px"><asp:TextBox ID="Insti_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
    </div>
    <div class="curriculumLadoRegistroizq">
      <div style="margin-top:10px" class="autenticacionTitulo">Año titulación</div>
      <div style="margin-top:5px"><asp:TextBox ID="año_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
    </div>
    <div class="curriculumLadoRegistro2">
      <div style="margin-top:10px" class="autenticacionTitulo">Años cursados</div>
      <div style="margin-top:5px"><asp:TextBox ID="cursados_pri" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
    </div>
  </div>
  <div>&nbsp;</div>
  <div style="padding-bottom:5px; border-bottom:solid 1px #cccccc" class="titulosGeneral">Formación Superior</div>
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Lugar (Ciudad, Pais)</div>
    <div style="margin-top:5px"><asp:TextBox ID="Lugar_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistro2">
    <div style="margin-top:10px" class="autenticacionTitulo">Nombre de la Institución</div>
    <div style="margin-top:5px"><asp:TextBox ID="Nombre_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq">
    <div style="margin-top:10px" class="autenticacionTitulo">Titulo obtenido</div>
    <div style="margin-top:5px"><asp:TextBox ID="titulo_sec" runat="server" MaxLength="100" ValidationGroup="Curriculum" CssClass="autenticacionTextBox"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq2">
    <div style="margin-top:10px" class="autenticacionTitulo">Año de titulación</div>
    <div style="margin-top:5px"><asp:TextBox ID="año_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
  </div>
  <div class="curriculumLadoRegistroizq3">
    <div style="margin-top:10px" class="autenticacionTitulo">Semestres cursados</div>
    <div style="margin-top:5px"><asp:TextBox ID="Semestre_sec" runat="server" MaxLength="25" ValidationGroup="Curriculum" CssClass="autenticacionTextBoxReducido"></asp:TextBox></div>
  </div>
</div>
  </div>
    <div style="text-align:right; margin-top:20px"><asp:Button ID="Button3" runat="server" ValidationGroup="Curriculum" postbackurl="Envia4.aspx" OnClick="Register" CssClass="my_btn"/></div>
  </div>
  </div>
于 2013-10-10T16:30:20.550 に答える