Question

我想点击下面html中的链接，创建一个模态，在模态打开时检索data-sid，然后点击模态按钮将其传递到另一个页面。

我有以下html：

results.Append("<td><a id=\"rateid\" data-toggle=\"modal\" href=" + bookPath + " data-sid=" + SRateID + "><span class=\"icon\">Book</span></a></td>");

JS：

<script type="text/javascript">
    var vareid;
    var varsrateid;
    function modalOutsideHours()
    {
        alert("1  -  Funtion {} runs");                                //hits this

        var vareid = document.getElementById('#rateid');
        alert("2  -  document.getEleByID runs");                       //hits this

        //    var show = rateid.getAttribute("data-sid");     //problem line breaks it
        alert('3  -  rateid = ' + vareid);        //returns null 

        alert("4  -  ");                    
        //     rateid.setAttribute("data-sid");
        alert("5");
        //      alert('data-sid = ' + varSRateID.value);
    };
</script>

模态html：

                <!-- Modal Book outside of Rota-->
            <div id="modalBookOutsideRota" class="modal fade"  tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">Book outside of Rota</h4>
                        </div>
                        <div class="modal-body">
                            <p>Select a reason why this visit is being booked outside of Rota hours, then click Book.</p>
                            <p><i>If the reason isn't listed select other and please give details in the box provided.</i></p>
                            <br />
                            <asp:DropDownList ID="ddlReasons" runat="server" CssClass="form-control input-sm m-b-10" DataSourceID="reasonSource" DataTextField="reason" DataValueField="OutOfRotaID"></asp:DropDownList>
                            <asp:SqlDataSource ID="reasonSource" runat="server" />
                            <asp:TextBox ID="txtNote" runat="server" CssClass="form-control overflow" placeholder="Note..."></asp:TextBox>
                        </div>
                        <div class="modal-footer">
                            <asp:Button ID="btnSubmitBooking" runat="server" CssClass="btn btn-sm" OnClick="btnSubmitBooking_Click" Text="Book" UseSubmitBehavior="false" data-dismiss="modal"/>
                            <button data-dismiss="modal" class="btn  btn-large"> Close</button>
                        </div>
                    </div>
                </div>
            </div>

模态按钮onclick事件：

        protected void btnSubmitBooking_Click(object sender, EventArgs e)
        {
            Reason = ddlReasons.SelectedValue;
            Note = txtNote.Text;

            Response.Redirect("<a href=\"Rosterbook.aspx?sid=" + SRateID + "&date=" + dateOfCare + "&rid=" + Reason + "&note=" + Note + "\"></a>");
        }

Answer 1

代码似乎很好。我创造了以下小提琴： http://jsfiddle.net/fb9f8aj5/1/

可能有几个原因：

浏览器问题：您是否在所有浏览器上都观察到此问题？
范围问题：运行脚本和加载HTML的顺序是什么？
你能从控制台中检索data-sid值吗？

我建议使用jQuery设置/检索data- *值：

$("#rateid").data("sid")

doc下面有更多信息：https://api.jquery.com/data/

传递变量并使用jQuery检索

1 个答案: