라디오 버튼을 “읽기 전용”으로 사용할 수없는 이유는 무엇입니까? 읽기 전용은 실제로 내가

라디오 버튼을 표시하고 값을 제출했지만 상황에 따라 편집 할 수 없도록했습니다. Disabled는 값을 제출하지 않거나 작동하지 않기 때문에 작동하지 않으며 라디오 버튼을 회색으로 표시합니다. 읽기 전용은 실제로 내가 찾고있는 것이지만, 신비한 이유로 작동하지 않습니다.

예상대로 작동하기 위해 읽기 전용을 얻기 위해 당겨야 할 이상한 트릭이 있습니까? 대신 JavaScript로해야합니까?

또한, 다른 입력 태그에서는 작동하지만 라디오 버튼에서는 읽기 전용이 작동하지 않는 이유를 아는 사람이 있습니까? 이것은 HTML 사양에서 이해할 수없는 누락 중 하나입니까?

답변

확인되지 않은 라디오 버튼 만 비활성화하여 라디오 버튼에서 읽기 전용을 가짜로 만들었습니다. 사용자가 다른 값을 선택하지 못하도록하며 확인 된 값은 항상 제출시 게시됩니다.

jQuery를 사용하여 읽기 전용으로 만들기 :

$(':radio:not(:checked)').attr('disabled', true);

이 방법은 선택되지 않은 각 옵션을 비활성화해야한다는 점을 제외하고 선택 목록을 읽기 전용으로 만드는 데에도 효과적이었습니다.

답변

다른 옵션이있는 경우 라디오 버튼은 읽기 전용이어야합니다. 다른 옵션이 없으면 확인 된 라디오 버튼을 선택 취소 할 수 없습니다. 다른 옵션이있는 경우 다른 옵션을 비활성화하여 사용자가 값을 변경하지 못하게 할 수 있습니다.

<input type="radio" name="foo" value="Y" checked>
<input type="radio" name="foo" value="N" disabled>

피들 : http://jsfiddle.net/qqVGu/

답변

이것은 당신이 갈 수있는 트릭입니다.

<input type="radio" name="name" onclick="this.checked = false;" />

답변

DB에 게시하는 긴 양식 (250 개 이상의 필드)이 있습니다. 온라인 취업 신청서입니다. 관리자가 제출 된 응용 프로그램을 보려고하면 양식이 db의 데이터로 채워집니다. 입력 텍스트와 텍스트 영역은 제출 한 텍스트로 바뀌지 만 라디오 및 확인란은 양식 요소로 유지하는 데 유용합니다. 비활성화하면 읽기가 더 어려워집니다. .checked 속성을 false로 설정하면 사용자가 앱을 작성하여 확인했을 수 있으므로 작동하지 않습니다. 아무리 해도…

onclick="return false;"

라디오 비활성화 및 ipso 사실상 확인란의 매력처럼 작동합니다.

답변

최선의 해결책은 클라이언트 또는 서버에서 검사 또는 검사되지 않은 상태를 설정하고 사용자가 병동 후 상태를 변경하지 못하도록 (즉, 읽기 전용으로) 다음을 수행하는 것입니다.

<input type="radio" name="name" onclick="javascript: return false;" />

답변

확인란과 라디오 버튼의 읽기 전용 상태를 달성하는 자바 스크립트가 많은 방법을 생각해 냈습니다. 현재 버전의 Firefox, Opera, Safari, Chrome 및 현재 및 이전 버전의 IE (IE7까지)에 대해 테스트되었습니다.

요청한 장애인 용 부동산을 단순히 사용하지 않는 이유는 무엇입니까? 페이지를 인쇄 할 때 비활성화 된 입력 요소가 회색으로 나타납니다. 이를 구현 한 고객은 모든 요소가 동일한 색상으로 나오기를 원했습니다.

회사에서 일하면서 개발하면서 소스 코드를 게시 할 수 있는지 확실하지 않지만 개념을 공유 할 수는 있습니다.

onmousedown 이벤트를 사용하면 클릭 동작이 변경되기 전에 선택 상태를 읽을 수 있습니다. 따라서이 정보를 저장 한 다음 onclick 이벤트로 이러한 상태를 복원하십시오.

<input id="r1" type="radio" name="group1" value="r1" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);" checked="checked">Option 1</input>
<input id="r2" type="radio" name="group1" value="r2" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);">Option 2</input>
<input id="r3" type="radio" name="group1" value="r3" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);">Option 3</input>

<input id="c1" type="checkbox" name="group2" value="c1" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);" checked="checked">Option 1</input>
<input id="c2" type="checkbox" name="group2" value="c2" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);">Option 2</input>
<input id="c3" type="checkbox" name="group2" value="c3" onmousedown="storeSelectedRadiosForThisGroup(this.name);" onclick="setSelectedStateForEachElementOfThisGroup(this.name);" checked="checked">Option 3</input>

이것의 자바 스크립트 부분은 다음과 같이 작동합니다 (개념 만).

var selectionStore = new Object();  // keep the currently selected items' ids in a store

function storeSelectedRadiosForThisGroup(elementName) {
    // get all the elements for this group
    var radioOrSelectGroup = document.getElementsByName(elementName);

    // iterate over the group to find the selected values and store the selected ids in the selectionStore
    // ((radioOrSelectGroup[i].checked == true) tells you that)
    // remember checkbox groups can have multiple checked items, so you you might need an array for the ids
    ...
}

function setSelectedStateForEachElementOfThisGroup(elementName) {
    // iterate over the group and set the elements checked property to true/false, depending on whether their id is in the selectionStore
    ...

    // make sure you return false here
    return false;
}

입력 요소의 onclick 및 onmousedown 속성을 변경하여 라디오 버튼 / 확인란을 활성화 / 비활성화 할 수 있습니다.

답변

선택되지 않은 라디오 버튼의 경우 비활성화 된 것으로 플래그를 지정하십시오. 이렇게하면 사용자 입력에 응답하지 않고 선택된 단일 선택 단추를 지울 수 없습니다. 예를 들면 다음과 같습니다.

<input type="radio" name="var" checked="yes" value="Yes"></input>
<input type="radio" name="var" disabled="yes" value="No"></input>