☰

jQuery で ID に . (ピリオド) が含まれる要素を選択するにはどうすればよいですか? 質問する

tag-icon • tag-icon javascript jquery jquery-selectors
jQuery で ID に . (ピリオド) が含まれる要素を選択するにはどうすればよいですか? 質問する

次のクラスとコントローラーアクションメソッドがあるとします。

public School
{
  public Int32 ID { get; set; }
  publig String Name { get; set; }
  public Address Address { get; set; }
}

public class Address
{
  public string Street1 { get; set; }
  public string City { get; set; }
  public String ZipCode { get; set; }
  public String State { get; set; }
  public String Country { get; set; }
}

[Authorize(Roles = "SchoolEditor")]
[AcceptVerbs(HttpVerbs.Post)]
public SchoolResponse Edit(Int32 id, FormCollection form)
{
  School school = GetSchoolFromRepository(id);

  UpdateModel(school, form);

  return new SchoolResponse() { School = school };
}

そして次の形式になります:

<form method="post">
  School: <%= Html.TextBox("Name") %><br />
  Street: <%= Html.TextBox("Address.Street") %><br />
  City:  <%= Html.TextBox("Address.City") %><br />
  Zip Code: <%= Html.TextBox("Address.ZipCode") %><br />
  Sate: <select id="Address.State"></select><br />
  Country: <select id="Address.Country"></select><br />
</form>

School インスタンスと学校の Address メンバーの両方を更新できます。これは非常に便利です。ASP.NET MVC チームに感謝します。

しかし、jQuery を使用してドロップダウン リストを選択し、事前に入力するにはどうすればよいでしょうか。サーバー側でこれを行うことはできますが、ページ上にはリストに影響する他の動的要素があることはわかっています。

これまでのところ、次のようになっていますが、セレクターが ID と一致していないため機能しません。

$(function() {
  $.getJSON("/Location/GetCountryList", null, function(data) {
    $("#Address.Country").fillSelect(data);
  });
  $("#Address.Country").change(function() {
    $.getJSON("/Location/GetRegionsForCountry", { country: $(this).val() }, function(data) {
      $("#Address.State").fillSelect(data);
    });
  });
});

ベストアンサー1

からGoogle グループ:

各特殊文字の前に 2 つのバックスラッシュを使用します。

jQuery セレクター内のバックスラッシュは、次の文字をエスケープします。ただし、バックスラッシュは JavaScript 文字列のエスケープ文字でもあるため、バックスラッシュは 2 つ必要です。最初のバックスラッシュは 2 番目のバックスラッシュをエスケープし、文字列内に実際のバックスラッシュが 1 つ存在し、jQuery の次の文字をエスケープします。

それで、あなたが見ているのは

$(function() {
  $.getJSON("/Location/GetCountryList", null, function(data) {
    $("#Address\\.Country").fillSelect(data);
  });
  $("#Address\\.Country").change(function() {
    $.getJSON("/Location/GetRegionsForCountry", { country: $(this).val() }, function(data) {
      $("#Address\\.State").fillSelect(data);
    });
  });
});

こちらもご覧くださいCSS 表記で使用される文字を含む ID で要素を選択するにはどうすればよいですか?jQuery FAQ をご覧ください。

おすすめ記事