2

重複の可能性:
<input > に「readonly」を追加 (jQuery)

これはとても奇妙です。簡単な説明があることを願っています。私はRailsで作業していますが、それは問題ではないと思います.

プロジェクトの html 要素に readonly 属性を直接追加し、ページをロードすると、入力フィールドが読み取り専用として動作します。ページが読み込まれると、要素は次のようになります。

<input class="span6" id="event_title" name="event[title]" readonly="readonly" size="30" type="text" value="test">

しかし、私は本当にjqueryを介して追加したい. 私がそれをするとき：

$('#event_title').attr(readyonly", "readonly")

ページが読み込まれると、要素は次のようになります。

<input class="span6" id="event_title" name="event[title]" size="30" type="text" value="test" readyonly="readonly">

しかし、フィールドはまだ編集可能であり、読み取り専用の兆候はありません! 助けてください....

4

7 に答える 7

5

これ：

$('#event_title').attr(readyonly", "readonly")

次のようにする必要があります。

$('#event_title').prop('readonly', true);

readyonlyはスペルミスであり、 、、 などの.prop属性のベスト プラクティスです。この投稿は違いを説明するのに役立ちます: .prop() vs .attr()readonlyselectedchecked

于 2012-10-05T07:53:56.653 に答える
3

「readonly」のスペルを間違えました$('#event_title').attr(readyonly", "readonly")-最初のパラメーターとして「readyonly」を取得しました:-)

于 2012-10-05T07:54:22.080 に答える
3

試す：

$('#event_title').attr('readonly', true);

于 2012-10-05T07:54:42.817 に答える
2

入力エラーがあります:

$('#event_title').attr(readyonly", "readonly")

次のように変更します。

$('#event_title').attr("readonly", "readonly")
于 2012-10-05T07:53:50.373 に答える
1

「attr」ではなく「prop」を使用してみてください

于 2012-10-05T07:53:44.533 に答える
0

同様の問題が発生しました。投稿のタイプミスは、ロードされたページの例がプロパティを正しく反映しているだけだと思います。

属性とプロパティの違いは何かということを自問する必要があることをお勧めします。つまり、いつ .attr と .prop を使用する必要があるかということです。

.prop が導入されたときの jQuery 1.6 および 1.6.1 のリリースに関して、多くの情報が投稿されていることがわかります。

私が理解している限り、すべてのオブジェクトと同様に、すべての DOM 要素には属性とプロパティの両方があります。古い .attr は、現在の .attr と .prop が分離しているように見えません。

私の場合、あなたの場合に当てはまると思いますが、これはブール属性に遭遇したときに特に重要でした.checked、selected、disabled、readonlyはboolean属性です。つまり、trueまたはfalseになります。これらが存在する場合、私が費用をかけて見つけたように、プロパティは特に重要です!

ブール値の属性は、null 値の属性が存在する場合でも true であると言えます。

したがって、読み取り専用を true に設定できます

<input readonly>または<input readonly="">または<input readonly="readonly">

したがって、jquery で .attr を使用して読み取り専用を制御すると、予期しない結果が生じる可能性があるため、読み取り専用のオンとオフを切り替える 

$('#event_title').prop("readyonly", true);
$('#event_title').prop("readyonly", false);

と言いたくなるかもしれませんのでご注意ください

$('#event_title').removeProp("readyonly");

オフに切り替えます。ただし、selected、checked、disabled などのネイティブ プロパティに適用すると元に戻すことができないため (ページが更新されるまで)、これは正しくありません。したがって、本当に削除したい場合にのみ削除を使用してください。

于 2012-10-05T09:34:18.917 に答える
-1

それはうまくいくはずです：

   $('#event_title').attr("readyonly", "readonly");

コンソールにも注目してください。JS エラーはありますか?

于 2012-10-05T07:54:07.950 に答える