3

私はJQueryを使用するのにかなりの能力があり、通常、ほとんどのことを少しいじって動作させることができます。この問題をグーグルで検索しようとしましたが、間違った用語を検索しているか、解決策が公開されていません。

注文フォームページ用にprint.cssファイルを準備するときに、テキストINPUTSを削除して、アドレスを含むSELECTメニューと同様に、値を出力するだけでよいかどうか尋ねられました。

調査しているときに、.val（）メソッド（現在は.fieldValue（）として知られています）と.serializeArray（）に出くわしたので、フォームの代わりに値を出力する方法ではなく、値を抽出する方法を知っていると思いますエレメント。

明確にするために：
たとえば、SELECTメニューには、デフォルトの配送先住所の最初の行が表示されます。印刷には、実際に住所全体を数行にわたって表示し、SELECTメニューは表示しないようにしたいと思います。

以下のソリューションが機能しており、値をキャプチャできますが、フォーム要素の代わりに値を挿入する方法がわかりません 。jQueryを使用してHTMLフォームを印刷する

助けてくれてありがとう！

編集キャプチャされた値は、HTMLのフォーム要素を置き換えるのではなく、プリントアウトにのみ挿入する必要があります。

4

1 に答える 1

1

jsfiddle としての基本的なソリューションは次のとおりです: http://jsfiddle.net/2mBSS/15/

基本的に：何かが起こったとき（ボタンがクリックされたときなど）、対応する要素をループし、.replaceWith()jQuery関数を使用してそれらを値に置き換えます...で取得し.val()ます. ご覧のとおり、これは要素<select>と同様にうまく機能します。<input>

もちろん、より複雑な HTML 要素を作成して、入力を次のように置き換えることもできます"<p>" + val + "</p>"。

これにより、ページがリロードされるまでフォーム入力フィールドが完全に削除されることに注意してください。これはまったく問題にならない場合があります (たとえば、印刷ページを新しいタブで開いた場合) またはサイトのデザインが壊れる可能性があります... 個人的には、印刷ページのスタイルを設定するために印刷 CSS シートを使用することを好みます。入力ボックスの境界。ただし、要素で選択されたオプションの値を抽出する必要がある場合、これはうまく機能しない可能性があります<select>。

ページをそのまま維持したい場合は、印刷用のテキストを保持する隠し要素をいくつか埋め込んで、印刷ボタンをクリックしたときに入力フォームの値をそれらにコピーすることをお勧めします...その後、印刷CSSですべてを非表示にします入力し、代わりにバッキング要素を表示します (たとえば<p>、 または<span>)。

于 2012-09-19T12:14:16.623 に答える