aspx ページの DOM オブジェクトにアクセスする正しいまたは効率的な方法

sharepoint.stackexchange https://sharepoint.stackexchange.com/questions/116596

  •  29-09-2020
  •  | 
  •  

質問

ユーザーが入力したテキストボックスの値を取得したい。以下は、aspx ページのコード スニペットです。

<asp:TextBox id="txtUserName" runat="server" />

aspxページのDOMオブジェクトにアクセスする最良の方法はどれですか

1.

<script type="text/javascript">
var value= document.getElementById(<%= txtUserName.ClientID %>).value;
alert(value);
</script>

2.

<script type="text/javascript">
var value= document.getElementById("txtUserName").value;
alert(value);
</script>
役に立ちましたか？

解決

SharePoint 2013/SharePoint Online

.NET Framework 4 が導入されました ClientIDMode プロパティ ASP.NET が ClientID クライアント スクリプトでアクセスできるコントロールの場合。

要約すると、SharePoint 2013 は .NET Framework 4 をターゲットとしているため、 ClientIDMode 以下に示すように、クライアント側での制御へのアクセスを簡素化するために利用できます。

例：

<asp:TextBox id="boxUserName" runat="server" ClientIDMode="Static" />

JavaScript:

var boxUserName = document.getElementById("boxUserName")

SharePoint 2010 以前のバージョン

前提条件: jQueryライブラリ ドキュメント内の要素のセットを一致させるための強力なツールセットを提供する使用されています。

オプション1

セレクターを使用して ID で要素を検索します。次に例を示します。 

var quickLaunch = $('[id$=V4QuickLaunchMenu]'); // find element with id which ends with the text 'V4QuickLaunchMenu'

オプション 2

使用 CssClass 要素クラスを指定するには、たとえば次のようにします。 

<asp:TextBox id="boxUserName" runat="server" CssClass="text-box" />

次に、クラスセレクターを使用します。

var boxUserName = $('input.text-box');

参考文献

他のヒント

オプション1は正しい方法ですが、変数名をJavaScriptキーワード

のように異なるものに変更するだけです。 
<script type="text/javascript">
 var _value= document.getElementById(<%= txtUserName.ClientID %>).value;
 alert(value);
</script>
.

しかし、私は人生をより簡単にするjQueryを使うことを好みます。それはあなたのASPXまたはMasterPageでjQueryファイルを追加します。その後、下の線

を使用してください 
<script type="text/javascript">
 $(document).ready(function(){     
   var _value= $(<%= txtUserName.ClientID %>).val();
   alert(value);
 });
</script>
.

ライセンス： CC-BY-SA と 帰属
所属していません sharepoint.stackexchange
scroll top