jquery - jquery ui accordion - 見出しタグのテキストだけをトリガーにする方法

Question

動的に入力されるアコーディオンがあります。トリガーとして機能する h2 内には、「編集」アイコンをクリックしたときにのみ表示される非表示のフィールドがいくつかあります。

ここに私の問題があります: h2 (どこでも) をクリックすると、パネルが開くだけでなく (これは適切です)、編集フィールドも表示されます。

h2のテキストだけをトリガーにするにはどうすればよいですか？

コード (変更):

<h2><span class="heading_span"><?=$oResource->section_order?>.&nbsp;</span>
 <?=$oResource->name?> <span class="note">(Section)</span>
 <a onclick="$resources.deleteResource(<?=$oResource->id?>)" href="Javascript:;" title="Delete this section" class="delete-resource" style="display: inline">
     <img src="/public/images/icons/delete.gif"">
 </a>
 <a onclick="$compass.resources.showEdit(<?=$oResource->id?>)" href="Javascript:;" title="Edit this section" class="edit-resource" style="display: inline">
     <img src="/public/images/icons/pencil.gif"">
 </a>
 <span id="edit-resource-<?=$oResource->id?>" style="display: none;">
     <span class="note">Order:</span>
     <select name="section-order-id-<?=$oResource->id?>" id="section-order-id-<?=$oResource->id?>" >
          <?= printOptions(Models\Core\resource::optionArrayList('section',''), array('selected'=>$oResource->section_order) ); ?>
     </select>
     <input type="text" placeholder="New Section Name"/>
     <button type="button" onclick="$resources.edit(<?=$oResource->id?>,<?=$oResource->section_order?>,'<?=$oResource->name?>','<?=$oResource->type?>',''); return false;">Save</button>
     <img src="<?=$oTheme->getUrl ()?>/ajax_loading_small.gif" alt="" id="loading-<?=$oResource?>" style="display: none;"/>
 </span>

そして、すべてのセクション項目が下に落ちます....