なぜこの関数はNaNを返しますか？

Question

最初はこれはJavaScriptのNaNに関する他の多くの質問と同じように思えるかもしれませんが、そうではないことを私は確信しています。 itemAcquiredTxtは2013」の値を持つことになり

var dateString = $('#itemAcquiredTxt').val(); //Would have a value of '2013-12-15' 
var dateAcquired = new Date(dateString); //Invalid Date ? 

テキストボックス：

私はテキストボックスから値をグラブ変換し、フォームのボタンをクリックした後の日付に変換し、コードのこの部分を持っています-12-15" データベース呼び出しから取られた（YYYY-MM-DD形式）：

$('#itemAcquiredTxt').val(new Date(item.DateAcquired).toLocaleDateString()); 

新しいDateオブジェクトを作成した後、それは私に与え、 "無効な日付を"。

OK ...だから私は年、月、日を数字として渡すことによってDateオブジェクトを作ることを考えました。これは他のコンストラクタの1つです。

var year = Number(dateString.split("-")[0]); //Returns NaN 
var month = Number(dateString.split("-")[1]); //Returns NaN 
var day = Number(dateString.split("-")[2]); //Returns NaN 
var dateAcquired = new Date(year, month - 1, day); //InvalidDate 

私はダッシュで日付のテキストボックスに文字列を分割しようとした、と数とのparseIntの両方を使用して数に文字列を変換する - が、両方は私にはNaNを与えました。私は文字列の値を二重にチェックし、何も間違っているように見えませんでした：分割された項目のそれぞれ "2013"、 "12"、 "15"。

私は自分自身に言った...多分私のコードが悪い、とJSFiddle https://jsfiddle.net/jrxg40js/
にしかし、あなたが見ることができるようにそれを試してみました、テキスト内の日付を配置し、ボタンを押した後、それは働きます！

HERESに関連するHTMLコード

<table id="inputTable"> 
      <tr> 
       <td><span><strong>Name:</strong></span></td> 
       <td><input id="itemNameTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Category:</strong></span></td> 
       <td> 
        <select id="categorySelect" ng-model="selectedCategory" ng-change="changeSubCategoryList(selectedCategory)" ng-options="cat as cat.CategoryName for cat in categoriesObj track by cat.CategoryID"> 
         <option value="">---Please Select One---</option> 
        </select> 
       </td> 
      </tr> 
      <tr ng-show="hasSubCat"> 
       <td><span><strong>Sub Category</strong></span></td> 
       <td> 
        <select id="subCategorySelect"> 
         <option value="">---Please Select One---</option> 
         <option ng-repeat="sub in subCategoryObj" value="{{sub.SubCatID}}">{{sub.SubCatName}}</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td><span><strong>Description:</strong></span></td> 
       <td><input id="itemDescriptionTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Serial Number:</strong></span></td> 
       <td><input id="itemSerialNumberTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Year:</strong></span></td> 
       <td><input id="itemYearTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Initial Cost:</strong></span></td> 
       <td><input id="itemValueTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Department:</strong></span></td> 
       <td> 
        <select id="departmentSelect"> 
         <option value="">---Please Select One---</option> 
         <option ng-repeat="dep in departmentsObj" value="{{dep.RoleID}}">{{dep.RoleDescription}}</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td><span><strong>Campus:</strong></span></td> 
       <td> 
        <select id="campusSelect" ng-model="selectedCampus" ng-change="changeBuildingList(selectedCampus)" ng-options="campus as campus.CampusDescription for campus in campusesObj track by campus.CampusID"> 
         <option value="">---Please Select One---</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td><span><strong>Building:</strong></span></td> 
       <td> 
        <select id="buildingSelect"> 
         <option value=""> </option> 
         <option ng-repeat="building in buildingsObj" value="{{building.BuildingID}}">{{building.BuildingDescription}}</option> 
        </select> 
       </td> 
      </tr> 
      <tr> 
       <td><span><strong>Date Acquired:</strong></span></td> 
       <td><input id="itemAcquiredTxt" type="text" value="" /></td> 
      </tr> 
      <tr> 
       <td><span><strong>Notes:</strong></span></td> 
       <td> 
        <textarea id="noteTxt"></textarea> 
       </td> 
      </tr> 
     </table> 

ユーザーをキーと新しいデータで項目を更新するために使用される関連AngularJS機能 - ユーザーが確認ボタンを押したときに関数が呼び出されます：

$scope.editItem = function() { 
    var dateString = $('#itemAcquiredTxt').val(); 
    dateAcquired = new Date(dateString); 
    var invItem = { 
     ItemID: $('#itemID').val(), 
     ItemName: $('#itemNameTxt').val().trim(), 
     CategoryID: $('#categorySelect').find(":selected").val(), 
     SubCategoryID: $('#subCategorySelect').find(":selected").val(), 
     Description: $('#itemDescriptionTxt').val().trim(), 
     SerialNumber: $('#itemSerialNumberTxt').val().trim(), 
     Year: $('#itemYearTxt').val().trim(), 
     DateAcquired: dateAcquired, 
     Value: $('#itemValueTxt').val().trim(), 
     RoleID: $('#departmentSelect').find(":selected").val(), 
     Barcode: null, 
     Notes: $('#noteTxt').val().trim(), 
     Deleted: null, 
     AddedBy: null, 
     DateAdded: null, 
     ModifiedBy: null, //Added by server 
     DateModified: null, 
     DeletedBy: '', 
     DateDeleted: null, 
     CampusID: $('#campusSelect').find(":selected").val(), 
     BuildingID: $('#buildingSelect').find(":selected").val(), 
     RoomID: null 
    }; 
    $http.put("api/inventory/", invItem).success(function (data, status, headers, config) { 
     inventoryData.retrieveData(); //On success, refresh zeh data 
    }).error(function (data, status, headers, config) { 
     console.log(data); 
    }); 

    $("#dialogForm").dialog("close"); 

JSFiddleのような他のサイトが私が期待しているものを返すとき、私のコードが私の作業環境（IE11でのVisual Studio 2015のデバッグ）でNaNを返すのはなぜですか？

Answer 1

この問題は修正されました。実際にはそれが何であったかはわかりません。

問題は、アイテムの更新中にのみ発生し、新しいアイテムを追加している間は発生しませんでした。そのため、エレメント値を入力したときに問題が発生していました。

$('#itemAcquiredTxt').val(new Date(item.DateAcquired).toLocaleDateString()); 

console.log(item.DateAcquired)は、文字列 "2015-12-15T00：00：00" が返さ行う、.toLocaleDateStringする（）は、 "2015年12月15日は" と日付オブジェクトに解析するために変換します。

その要素の値を編集すると、その文字列を日付に変換しようとすると常にNaN/InvalidDateが返されます。

私のソリューションでした...

$('#itemAcquiredTxt').val(item.DateAcquired.split('T')[0]); 

まったく日付を使用していません。 これで動作します。