jQuery를 사용하여 입력을 읽기 전용으로 만들려면 어떻게 해야 합니까?
다음과 같은 정보가 있습니다.
<input id="fieldName" name="fieldName" type="text" class="text_box" value="Firstname"/>
요소나 값을 변경하지 않고 jQuery를 사용하여 이 요소를 읽기 전용 입력으로 만들려면 어떻게 해야 합니까?
jQuery 1.6.1 이상 버전에서는 부울 특성/속성을 설정할 때 .prop()를 사용하는 것이 좋습니다.
$("#fieldName").prop("readonly", true);
다음 속성을 간단히 추가합니다.
// for disabled i.e. cannot highlight value or change
disabled="disabled"
// for readonly i.e. can highlight value but not change
readonly="readonly"
jQuery(jQuery))disabled위해서readonly설정을 위해 과 같이 합니다.readonly속성)을 선택합니다.
$('#fieldName').attr("disabled","disabled")
또는
$('#fieldName').attr("disabled", true)
참고: jQuery 1.6부터는 대신 을 사용하는 것이 좋습니다.대체 코드를 제외하고 위의 코드는 정확히 동일하게 작동합니다..attr()위해서.prop().
입력을 읽기 전용으로 만들려면 다음을 사용합니다.
$("#fieldName").attr('readonly','readonly');
읽기/쓰기를 위해 다음을 사용합니다.
$("#fieldName").removeAttr('readonly');
추가disabled특성이 게시물과 함께 값을 보내지 않습니다.
가지 즉 두가지속있다습니즉이성,utes,readonly그리고.disabled반 읽기 전용 입력을 만들 수 있습니다.하지만 그들 사이에는 아주 작은 차이가 있습니다.
<input type="text" readonly />
<input type="text" disabled />
- 그
readonly속성을 사용하면 입력 텍스트가 비활성화되고 사용자는 더 이상 텍스트를 변경할 수 없습니다. - 뿐만 아니라,
disabled속성을 사용하면 입력 텍스트가 비활성화(변경 불가능)되지만 제출할 수도 없습니다.
jQuery 접근법(1):
$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);
jQuery 접근법(2):
$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");
JavaScript 접근 방식:
document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;
prop로개된소로 jQuery 1.6.
표만하됩니다면으로 으로 할 수 .disabled또는enabled이 코드를 사용하여 다음 작업을 수행할 수 있습니다.
//for disable
$('#fieldName').prop('disabled', true);
//for enable
$('#fieldName').prop('disabled', false);
또는
$('#fieldName').prop('읽기 전용', true);
$('#fieldName').prop('읽기 전용', false);
특성 대신 소품을 사용하는 것이 좋습니다.
이 예를 사용하여 텍스트 상자를 읽기 전용 또는 읽지 않음으로 만듭니다.
<input type="textbox" class="txt" id="txt"/>
<input type="button" class="Btn_readOnly" value="Readonly" />
<input type="button" class="Btn_notreadOnly" value="Not Readonly" />
<script>
$(document).ready(function(){
('.Btn_readOnly').click(function(){
$("#txt").prop("readonly", true);
});
('.Btn_notreadOnly').click(function(){
$("#txt").prop("readonly", false);
});
});
</script>
주어진 -
<input name="foo" type="text" value="foo" readonly />
작동합니다 - (jquery 1.7.1)
$('input[name="foo"]').prop('readonly', true);
읽기 전용 및 읽기 전용으로 테스트됨 - 둘 다 작동했습니다.
비활성화된 특성 사용:
<input disabled="disabled" id="fieldName" name="fieldName" type="text" class="text_box" />
아니면 그냥 라벨 태그를 사용하세요: ;)
<label>
<html xmlns="http://www.w3.org/1999/xhtml">
<head >
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
</head>
<body>
<div>
<input id="fieldName" name="fieldName" type="text" class="text_box" value="Firstname" />
</div>
</body>
<script type="text/javascript">
$(function()
{
$('#fieldName').attr('disabled', 'disabled');
});
</script>
</html>
아마도 그것을 덧붙이는 것도 의미가 있을 것입니다.
$('#fieldName').prop('readonly',false);
토글 옵션으로 사용할 수 있습니다.
JQuery 1.12.1에서 내 응용 프로그램은 다음 코드를 사용합니다.
$('"#raisepay_id"')[0].readOnly=true;
$('"#raisepay_id"')[0].readOnly=false;
그리고 그것은 동작한다.
setReadOnly(상태)는 양식에 매우 유용하며, 직접 또는 다양한 조건에서 임의의 필드를 설정하여 ReadOnly(상태)를 설정할 수 있습니다.하지만 선택기에 불투명도를 설정할 때 readOnly를 사용하는 것을 선호합니다. 그렇지 않으면 attrr='disabled'도 같은 방식으로 작동합니다.
읽기 전용 예제:
$('input').setReadOnly(true);
아니면 같은 다양한 코드를 통해.
var same = this.checked;
$('input').setReadOnly(same);
여기서는 상태 부울 값을 사용하여 확인란 클릭에 따라 입력에서 읽기 전용 특성을 설정하고 제거합니다.
HTML에서
$('#raisepay_id').attr("readonly", true)
$("#raisepay_id").prop("readonly",true);
장화를 신고
$('#raisepay_id').attr("disabled", true)
$("#raisepay_id").prop("disabled",true);
JQuery는 변화하는 라이브러리이며 때때로 정기적으로 개선됩니다. .attr()은 HTML 태그에서 속성을 가져오는 데 사용되며, 완벽하게 기능하는 동안 더 의미를 부여하기 위해 나중에 .prop()가 추가되었으며 'checked' 및 'selected'와 같은 값이 없는 속성에서 더 잘 작동합니다.
최신 버전의 JQuery를 사용하는 경우에는 가능할 때마다 .prop()를 사용하는 것이 좋습니다.
언급URL : https://stackoverflow.com/questions/1362153/how-can-i-use-jquery-to-make-an-input-readonly
'prosource' 카테고리의 다른 글
| 텍스트 파일의 내용을 자바스크립트 변수로 로드하려면 어떻게 해야 합니까? (0) | 2023.08.06 |
|---|---|
| 문자열에서 동일한 각 인수에 대한 변수를 지정해야 합니까?포맷? (0) | 2023.08.06 |
| mysql에서 UPDATE를 수행하는 동안 여러 행에서 고유한 값을 설정하는 방법 (0) | 2023.08.06 |
| Uncaught TypeError: 정의되지 않은 'top' 속성을 읽을 수 없습니다. (0) | 2023.08.06 |
| 활동 컨텍스트 또는 응용 프로그램 컨텍스트를 호출해야 하는 경우 (0) | 2023.08.06 |