html div div標籤位置的隨機序列

在這個GridView中有四個div標籤，ID="NUMBER1"ID="NUMBER2"ID="NUMBER3"ID="NUMBER4"值，我想在gridview的每一行中隨機更改它們在頁面中的位置順序。什麼是最好，最簡單的SERVER SIDE方法來做到這一點。我是新來的使用C＃語言的asp.net。html div div標籤位置的隨機序列

<body> 
    <asp:GridView OnRowCommand="SelectedPollGridView_RowCommand" ID="SelectedPollGridView" runat="server" AutoGenerateColumns="False" DataKeyNames="QuesID" DataSourceID="SelectedPollSqlDataSource"> 
     <Columns> 
      <asp:TemplateField HeaderText="Questions"> 
       <ItemTemplate> 
        <div runat="server" id="MainDiv" class="text-right col-md-12"> 
         <div class="row "> 
          <div dir="rtl" class="col-md-12 text-right"> 
           <p runat="server" id="BodyPTag"><%#Eval("Body") %></p> 
           <asp:Label Visible="false" ID="QuesIDLabel" runat="server" Text='<%#Eval("QuesID") %>'></asp:Label> 
          </div> 
         </div> 
         <div id="NUMBER1" runat="server" class="row "> 
          <div class="col-md-12"> 
           <div dir="rtl" runat="server" id="Div2" class="text-right col-md-11"> 
            <asp:Label ID="Label1" runat="server" Text='<%#Eval("O1") %>'></asp:Label> 
           </div> 
           <div runat="server" id="Div3" class="text-right col-md-1"> 
            <asp:Button CommandArgument='<%# ((GridViewRow) Container).RowIndex %>' CommandName="O1" CssClass='<%#Eval("O1Css") %>' ID="O1Button" runat="server" Text="Option 1" /> 
           </div> 
          </div> 
         </div> 
         <div id="NUMBER2" runat="server" class="row "> 
          <div class="col-md-12"> 
           <div dir="rtl" runat="server" id="Div4" class="text-right col-md-11"> 
            <asp:Label ID="Label2" runat="server" Text='<%#Eval("O2") %>'></asp:Label> 
           </div> 
           <div runat="server" id="Div5" class="text-right col-md-1"> 
            <asp:Button CommandArgument='<%# ((GridViewRow) Container).RowIndex %>' CommandName="O2" CssClass='<%#Eval("O2Css") %>' ID="O2Button" runat="server" Text="Option 2" /> 
           </div> 
          </div> 
         </div> 
         <div id="NUMBER3" runat="server" class="row "> 
          <div class="col-md-12"> 
           <div dir="rtl" runat="server" id="Div6" class="text-right col-md-11"> 
            <asp:Label ID="Label3" runat="server" Text='<%#Eval("O3") %>'></asp:Label> 
           </div> 
           <div runat="server" id="Div7" class="text-right col-md-1"> 
            <asp:Button CommandArgument='<%# ((GridViewRow) Container).RowIndex %>' CommandName="O3" CssClass='<%#Eval("O3Css") %>' ID="O3Button" runat="server" Text="Option 3" /> 
           </div> 
          </div> 
         </div> 
         <div id="NUMBER4" runat="server" class="row "> 
          <div class="col-md-12"> 
           <div dir="rtl" runat="server" id="Div8" class="text-right col-md-11"> 
            <asp:Label ID="Label4" runat="server" Text='<%#Eval("O4") %>'></asp:Label> 
           </div> 
           <div runat="server" id="Div9" class="text-right col-md-1"> 
            <asp:Button CommandArgument='<%# ((GridViewRow) Container).RowIndex %>' CommandName="O4" CssClass='<%#Eval("O4Css") %>' ID="O4Button" runat="server" Text="Option 4" /> 
           </div> 
          </div> 
         </div> 
        </div> 
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
    </asp:GridView> 
    <asp:SqlDataSource ID="SelectedPollSqlDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:GUOTSConnectionString %>" SelectCommand="SELECT DISTINCT QuesID, Body, O1, O2, O4, O3, O1Css, O2Css, O4Css, O3Css, Time, BookRange, UserID, CourseID, Code FROM Question WHERE (UserID = @userid) AND (Code = @code)"> 
     <SelectParameters> 
      <asp:QueryStringParameter Name="code" QueryStringField="code" /> 
      <asp:SessionParameter Name="userid" SessionField="userid" /> 
     </SelectParameters> 
    </asp:SqlDataSource> 
</body>

來源

2014-01-13 Mahdi Hesari

隨機隨機的？就像他們在刷新時切換頁面上的位置一樣？或者你的意思是'任意'，因爲他們有一個特定的順序不會改變，但它不像代碼中的順序？ –

實際上這是一個在線考試，我想爲每個用戶的每個問題隨機顯示選項序列，以便他們不能告訴對方的正確選項的數量:)。 –

以下將做你想要的。

Working FIDDLE here

第一，改變當前的div給各行的類名，我們可以在我們的腳本挑出，如「randomDiv」。我們可以使用「行」，但我擔心你在更多的地方使用它，而不僅僅是這些div。

<div id="NUMBER1" runat="server" class="row randomDiv">

然後在文件準備運行下面的JavaScript：

<script> 
    $(document).ready(function() { 

     var divs= $(".randomDiv"); 
     for(var i = 0; i < divs.length; i++){ 
      var target = Math.floor(Math.random() * divs.length -1) + 1; 
      var target2 = Math.floor(Math.random() * divs.length -1) +1; 
      divs.eq(target).before(divs.eq(target2)); 
     } 

    }); 
</script>

來源

2014-01-13 16:03:05 erikrunia

有沒有服務器端的方法？因爲如果用戶在瀏覽器中關閉Java腳本，它不會發生。這是至關重要的，必須以任何方式發生。非常感謝你。 –

人們仍然這樣做嗎？在瀏覽器中關閉javascript？這似乎是如此1997. – erikrunia

實際上這是一個在線考試，我想爲每個用戶的每個問題隨機顯示選項序列，因此他們不能告訴對方的正確選項的數量。 –

html div div標籤位置的隨機序列

回答

相關問題