javascript - タブ付きの一般的な html\javascript サフィックスを表示する方法

Question

あまり素晴らしいタイトルではないことをお許しください。私はあまり HTML 開発を行っておらず、少しずつハッキングして学んでいます。Javascript と HTML を使用して、複数のビューを持つフォームを作成しようとしています。

私の目標は、データを複数のモードで入力できるようにすることです。例として、倉庫内の製品に関するデータを入力しているとします。ページ 1 は主に倉庫情報を扱い、ページ 2 は主に製品情報を扱います。現在、jQueryタブでこれを行っています。

現在、各タブでhttp://jqueryui.com/tabs/のjQuery タブを使用しています

    <div id="tabs-1">
    <iframe src="enterdbInfo.shtml" width=100% height=1610>        
    </iframe></div>
    <div id="tabs-2">
    <iframe src="enterproducts.shtml" width=100% height=1610>        
    </iframe></div>

ユーザーが enterDbInfo.shtml で特定の製品をクリックすると、製品の詳細ビューが表示されます。問題は、enterproducts.shtmlにも同じ製品詳細ビューを表示していることです。これは、両方のドキュメントで SSI を使用して含まれている共有 html ドキュメントで行われます。

enterdbInfo.shtml と enterproducts.shtml を別々に表示すると問題なく表示されます。しかし、それらがタブ付きの同じ親ドキュメントに読み込まれると、商品詳細フィールドに作用する JavaScript は、enterdbInfo.shtml の要素のみに作用し、同じ名前の enterproducts.shtml フィールドには作用しません。なぜそうなるのかはわかっていますが、それをうまく回避する方法はわかりません。

これを回避する良い方法はありますか？