辅助功能，当在我的图像上按 Enter 时，屏幕会重新加载

Question

我正在尝试转换我的 JS 代码，以便我可以通过 Tab 键浏览它并按 Enter 键来显示时间打孔。然而，在我将其转换为按钮后，它不再按照预期的方式运行。每当我在图像上按 Enter 时，它都会重新加载整个页面。我在这里做错了什么？

原始代码

<img tal:condition="python:len(punches)>0" onclick="toggleVisibilityByRow('Swipe_line')" 
ref="javascript:void(0);" src="/AcuStaf/images/fold.gif" id="img_Swipe_line" class="clickable" />
&nbsp;
<span tal:condition="float_swipes" id="swipe_float_units" style="display:none">
<span style="font-weight:bold">Float&nbsp;to&nbsp;</span>
<span tal:replace="structure python:container.util.getUnitSelects(my_form='swipe_form', my_var='float_unit', my_var_value='', unit_type='sch_unit', multiunit=False, use_unit_default=False, text_input=True)"></span>
<input type="button" data-inline="true" data-mini="true" onclick="jQuery('#float_unit').attr('disabled','disabled'); jQuery('#swipe_float_units').hide(); jQuery('#float_swipes_button').show()" style="margin-left:3em" title="Float to a alternate location or work" value="Remove Float" />
<br/>
<span style="font-weight:bold">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
</span>

转换为可访问性按钮

<button class="blend" onclick="toggleVisibilityByRow('Swipe_line')" 
                  title="Show time punches">
                  <img src="/AcuStaf/images/fold.svg" 
                  id="img_Swipe_line" class="clickable" alt=">" tal:condition="python:len(punches)>0" ref="javascript:void(0);">
                  </button>
&nbsp;
<span tal:condition="float_swipes" id="swipe_float_units" style="display:none">
<span style="font-weight:bold">Float&nbsp;to&nbsp;</span>
<span tal:replace="structure python:container.util.getUnitSelects(my_form='swipe_form', my_var='float_unit', my_var_value='', unit_type='sch_unit', multiunit=False, use_unit_default=False, text_input=True)"></span>
<input type="button" data-inline="true" data-mini="true" onclick="jQuery('#float_unit').attr('disabled','disabled'); jQuery('#swipe_float_units').hide(); jQuery('#float_swipes_button').show()" style="margin-left:3em" title="Float to a alternate location or work" value="Remove Float" />
<br/>
<span style="font-weight:bold">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
</span>

我在“nbsp;”之后没有更改任何内容只是提供它以备不时之需。