当我点击代码隐藏上的<li>时,Javascript函数返回错误

时间:2016-08-26 09:54:16

标签: javascript c# asp.net

我使用后面的代码(something.ascx.cs)使用以下代码从我的数据库生成无序列表。

$(document).ready(function () {
    var pp = document.getElementById('papaya');
    alert(pp.val().length);
});

但是当我点击列表时它会给出错误“getCourseCategory”没有定义。所以我的问题是如何访问“getCourseCategory”函数,其定义在something.ascx文件中。

foreach (DataRow row in dt.Rows)
        {
            htmlRender.Append("<ul>");
            for (int i = 1; i < dt.Columns.Count; i++)
            {
                var courseCategory = row[i-1];
                htmlRender.Append("<li id='"+ courseCategory + "' onclick='getCourseCategory(this.id)'  >");
                htmlRender.Append(row[i]);
                htmlRender.Append("</li>");                    
            }
            htmlRender.Append("</ul>");                
        }

3 个答案:

答案 0 :(得分:2)

你在document.ready内写了函数,它应该在那之外。

<script type="text/javascript">
   function getCourseCategory(courseCategoryID) {
    alert('hello');
}
</script>

答案 1 :(得分:0)

当您点击列表项时,我认为this不可用...

foreach(var row in dt.Rows)
{
    htmlRender.Append("<ul>");
    for(var i = 0; i <= dt.Columns.Count; i++)
    {
        var courseCategory = row[i];
        htmlRender.Append("<li id='"+ courseCategory + "' onclick='getCourseCategory(" + courseCategory + ")' >");
        ....
        htmlRender.Append("</li>");
    }
    htmlRender.Append("</ul>");
}

答案 2 :(得分:0)

也许更好的方法是使用javascript(在我的情况下使用jquery)来绑定click函数。

ascx.cs:

    foreach (DataRow row in dt.Rows)
    {
        htmlRender.Append("<ul>");
        for (int i = 1; i < dt.Columns.Count; i++)
        {
            var courseCategory = row[i-1];
            htmlRender.Append("<li data-id='"+ courseCategory + "'>");
            htmlRender.Append(row[i]);
            htmlRender.Append("</li>");                    
        }
        htmlRender.Append("</ul>");                
    }

Javascript代码:

$(document).ready(function(){

  function getCourseCategory(inputId) {
    console.log('Your input was: ' + inputId);
  }

  $('li').on('click', function(){
    var id = $(this).attr('data-id');
    getCourseCategory(id);
  });
});

代码未经过测试,因为我无法在我的系统上重建ascx。但我认为它应该有效