Javascript配列がうまくいきませんか？

Question

さらに多くのコードと新しい情報が含まれるように編集されました。

<asp:Table ID="Table1" runat="server" BorderWidth="2px" CellSpacing="2" GridLines="Both" Width="465px"> 
    <asp:TableRow ID="labelRow0" runat="server"> 
     <asp:TableCell runat="server">Name</asp:TableCell> 
     <asp:TableCell runat="server">Address</asp:TableCell> 
    </asp:TableRow> 
    <asp:TableRow ID="inputRow0" runat="server"> 
     <asp:TableCell ID="inputName" runat="server"> 
      <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></asp:TableCell> 
     <asp:TableCell ID="inputAddress" runat="server"> 
      <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox></asp:TableCell> 
    </asp:TableRow> 
    <asp:TableRow ID="labelRow1" runat="server"> 
     <asp:TableCell runat="server">Favourite Colour</asp:TableCell> 
     <asp:TableCell runat="server">Favourite Number</asp:TableCell> 
    </asp:TableRow> 
    <asp:TableRow ID="inputRow1" runat="server"> 
     <asp:TableCell ID="inputColour" runat="server"> 
      <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox></asp:TableCell> 
     <asp:TableCell ID="inputNumber" runat="server"> 
      <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox></asp:TableCell> 
    </asp:TableRow> 
</asp:Table> 
<asp:Button ID="buttonScramble" runat="server" Text="Scramble Info" onClientClick="return buttonScramble()" /> 
</div> 

<script> 
function buttonScramble() { 
    var name = document.getElementById("TextBox1").value; 
    var address = document.getElementById("TextBox2").value; 
    var colour = document.getElementById("TextBox3").value; 
    var number = document.getElementById("TextBox4").value; 
    alert(name, address, colour, number); 

    var arr = [name, address, colour, number]; 
    alert(arr[0]); 
    //alert(arr[0], arr[1], arr[2], arr[3]); 
    arr.shuffle(arr); 
    alert(arr[0], arr[1], arr[2], arr[3]); 
    document.getElementById("TextBox1").value = arr[0]; 
    document.getElementById("TextBox2").value = arr[1]; 
    document.getElementById("TextBox3").value = arr[2]; 
    document.getElementById("TextBox4").value = arr[3]; 
    } 

"alert（arr [0]）;"コード行は決して引き起こされません。名前、アドレスなどの変数の値をチェックしたら、それらは正しく割り当てられていません。アレイが正しく割り当てられていない理由を説明します。

Answer 1

<asp: ID=""属性がレンダリングされると予想される属性と一致しないことがよく知られています（ASP.NETがid=""属性をページ上で一意になるように書き換えるためです）。クライアント側idは、HTML内で一意である必要がありますが、<asp:Repeater内にレンダリングまたはUserControlを再利用した場合、自身のID=""性質を持つ単一のWebBrowserコントロールは、何回も繰り返すことができるお使いのブラウザのJavaScriptコンソールとJavaScriptデバッガで

ルック - 。あなたはおそらくよgetElementByIdがnullを返すため「プロパティvalueにnullまたは未定義にアクセスできません。

これにあなたのJavaScript/ASP.NETを変更

：

var textBox1Id = "<%= this.TextBox1.ClientID "; 
var textBox1 = document.getElementById(textBox1Id); 

私はそれがこのようなものとしてレンダリングされることを賭ける：

var textBox1Id = "__ctrl0_form0_foo_bar_textBox1"; 

別のオプションは、へClientIDModeプロパティセットを使用することですStatic（https://msdn.microsoft.com/en-us/library/system.web.ui.control.clientidmode%28v=vs.110%29.aspx?f=255&MSPPError=-2147217396）

<asp:TextBox runat="server" ID="textBox1" ClientIDMode="Static" /> 

...これはあなたのページ上のすべてのコントロールにそのプロパティを設定することを意味します。

Answer 2

は、あなたがこの

のようなオブジェクトに値をラップが、あなたのすべてが未定義またはnullではないDOMから値を確認することができかもしれません。

var arr = [{value:name}, {value:address}, {value:colour}, {value:number}]; 
console.log(arr[0]["value"]); 

この1

<button ID="buttonScramble" onClick="buttonScramble()">Scramble Info</button> 

Answer 3

JavaScriptはオブジェクトリテラル取る、私はあなたのコードがうまくてXhtmlへ クライアント側にレンダリングして配信されると仮定し、IDSのTextBox1、TextBox2を、入力/フォームに割り当てられています要素。

例：

function exec() { 
    var name = 'answer'; 

    var object_literal = { 
     name: document.getElementById('TextBox1').value, 
     street: document.getElementById('TextBox2').value, 
     answer: name 
    }; 
    alert(object_literal.name); 
    alert(object_literal.street); 
    alert(object_literal.answer); 
} 

exec();