Javascript가 첫 번째 대신 두 번째 버튼 클릭으로 작업 중

버튼 클릭시 양식 정보를 표시하고 활성화하려고하는 표가 있습니다. 테이블은 "display : none"으로 설정되고 버튼은 자바 스크립트에 연결됩니다. 자바 스크립트는 버튼이 두 번 클릭 된 후에 만 작동합니다. 처음 클릭 할 때 작동하도록하고 싶습니다.Javascript가 첫 번째 대신 두 번째 버튼 클릭으로 작업 중

버튼 & 테이블 HTML은 :

#newPatientForm { 
    display: none; 
}

이 자바 스크립트 버튼 호출은 다음과 같습니다

<button data-bind="click: addPatient" style="margin-top: 20px; margin-bottom: 10px;">Add Patient</button> 
    <table id="newPatientForm"> 
     <tr> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th></th> 
     </tr> 
     <tbody data-bind="foreach:Patients"> 
      <tr> 
       <td class="form-group"><input data-bind="value: FirstName, event: {change: flagPatientAsEdited}, hasfocus: true" /></td> 
       <td class="form-group"><input data-bind="value: LastName" /></td> 
       <td class="form-group"><button data-bind="click: $parent.removePatient">Delete</button></td> 
      </tr> 
     </tbody> 
    </table>

이 테이블 CSS입니다. 이 위의 방법을 사용

if (isHidden(divElement)) {

에 스타일 시트

function isHidden(elem) { 
    var style = window.getComputedStyle(elem); 
    return style.display === "none"; 
}

변경

if (divElement.style.display == 'none') {

에 설정되어있는 경우

self.addPatient = function() { 
     var divElement = document.getElementById('newPatientForm'); 
     var patient = new PatientViewModel({ SiteId: 0, FirstName: "", LastName: "", ObjectState: ObjectState.Added }); 
     if (divElement.style.display == 'none') { 
      divElement.style.display = 'block'; 
      self.Patients.push(patient); 
     } 
     else { 
      divElement.style.display = 'none'; 
      self.Patients.pop(patient); 
     } 
    },

출처

2015-01-21 AtlasBowler

왜 jQuery 태그가 필요합니까? – j08691

이렇게하십시오 :'console.log (divElement.style.display)'그리고 당신은 왜 – epascarello

@ j08691이 우스꽝스럽게 보일 것입니다. 그것을 버릇없이 버려야 만합니다. – AtlasBowler

당신은 계산 된 스타일을 확인해야합니다.

숨겨진 클래스를 가지고 클래스를 토글하는 것이 더 나을 것입니다.

마지막으로, 나는 생각하지 않습니다. self.Patients.pop(patient); 님이하고있는 일을 생각하고 계십니다. pop 메서드에는 인수가 없습니다. 요소를 찾아서 제거하지 않습니다.

출처

2015-01-21 17:22:29 epascarello

배열 자체에서 요소를 제거하기 위해'pop'을 추가하지 않았습니다. 나는 폼을 표시하기 위해 버튼을 클릭 할 때마다 클릭 할 때마다 폼 요소를 추가했기 때문에이를 추가했습니다. 그래서 테이블/폼을 3 번 표시하기 위해 버튼을 클릭하면 환자를 추가하기 위해 3 가지 폼이 표시됩니다. 클릭 횟수에 상관없이 1 폼만 표시하기 때문에 팝업을 사용했습니다. – AtlasBowler

제안 사항 isHidden 변경이 작동합니다! 감사! – AtlasBowler

Javascript가 첫 번째 대신 두 번째 버튼 클릭으로 작업 중

답변

관련 문제