html - plsql动态内容区域超链接不起作用

Question

我正在处理 plsql 动态内容以生成一些 html 基本控件<ul>，例如在列表项<li>上实现超链接时遇到问题。<li>问题是，一旦我运行代码，它会生成所有列表，但超链接仅适用于第一个列表项，我想将参数发送到在<li>超链接上打开的模态对话。

这是我如何生成列表项的代码

FOR i IN WEEK LOOP
  htp.p('<h3>'||i.WEEK_NAME||'</h3>'); 
  FOR j IN DAYS (i.WEEK_ID) LOOP    
    htp.p('<div class="div">');
    htp.p('<h3>'||j.WEEK_DAY||'</h3>');
    htp.p('<ul class=menu>');
    htp.p('<br>');
    FOR k IN MEALS (j.DAY_ID,i.WEEK_ID)  LOOP   

            htp.p('<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal"></i>
                            </a>
                            <span>'||k.MEAL_NAME||'</span>
                        </li>');

    END LOOP;
    htp.p('</ul>');
    htp.p('</div>');
  END LOOP;
END LOOP;

    htp.p('</body>');
    htp.p('</html>');

请建议我对超链接仅对第一个列表项启用的超链接到底做错了什么

更新

<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 1</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 2</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 3</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 1</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 2</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 3</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 1</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 2</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 3</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 1</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 2</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 3</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 1</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 2</span>
                        </li>
<li>
                            <a href="javascript:void(0);">
                                <i class="fa fa-plus" id = "modal" value="abc"></i>
                            </a>
                            <span>Meal 3</span>
                        </li>