如何将匿名jQuery代码转换为命名函数并调用它？

-3

虽然我已经通过了这个thread关于上述题目的问题，但仍然无法解决我的问题。如何将匿名jQuery代码转换为命名函数并调用它？

MY jQuery代码在单独的JS文件[test.js]： -

jQuery(document).ready(function($){ 

$("#category").change('select',function() 
{ 
    var category_id="category_id="+$("#category").val(); 

    $.getJSON("get_topic",category_id, function(topic) 
    { 
     $('#topic').empty(); 
     $('#topic').append("<option>--- Select Topic ---</option>"); 

     for(var t in topic) 
     { 
      var option = $('<option />'); 
      option.attr('value', topic[t].id).text(topic[t].name); 
      $('#topic').append(option); 
     } 

    }); 
});

}）;

现在我已经在我的PHP页眉中添加了这个js文件。

<script src="http://localhost.dev/public/js/test.js"></script>

此代码为我工作的罚款。但是我已经将这个匿名代码转换为命名函数addTopic。

我的新代码修改[test.js]： - ： -

function addTopics() 
{ 
    alert ('hi'); 
    $("#category").change('select',function() 
    { 
     var category_id="category_id="+$("#category").val(); 

     $.getJSON("get_topic",category_id, function(topic) 
     { 
      $('#topic').empty(); 
      $('#topic').append("<option>--- Select Quiz Topic ---</option>"); 

      for(var t in topic) 
      { 
       var option = $('<option />'); 
       option.attr('value', topic[t].id).text(topic[t].name); 
       $('#topic').append(option); 
      } 

     }); 
    }); 
}

现在我打电话在我的PHP页面这个方法： -

<select id="category" class="form-control" onchange="addTopics()" name="category">

现在，新的代码不加工。请帮我解决这个问题。

在此先感谢。

编辑： -

问题范围：

我有jQuery的匿名代码。这工作正常。但我想将该匿名jQuery代码转换为指定的jQuery函数。所以我可以调用那个jQuery函数，我需要调用它，而不是自动调用它。

来源

2014-09-03 game of matrix

我不明白你要做什么。 – Mathletics 2014-09-03 16:23:24

将匿名函数更改为命名函数是一回事，但您为什么试图删除完美无缺的JavaScript并将其替换为内嵌JavaScript？ – Nope 2014-09-03 16:25:45

在我的项目中有主页的概念。在主页面标记中，我打电话给所有js，css文件。这些js文件将被自动添加到母版页的所有子页面中。我想要使用命名的jquery函数。 – 2014-09-03 16:46:01

HTML：

不要在你的HTML应用的事件处理程序。它只是不好的做法。而不是仅仅使用你所需要的

<select id="category" class="form-control" name="category">

JS：

应用的事件处理程序在JavaScript这样的：

$("#category").change('select', addTopics);

和seperately定义函数为命名的功能。事件处理程序现在会调用它。

function addTopics() 
{ 
    alert('hi'); 
    var category_id="category_id="+$("#category").val(); 

    $.getJSON("get_topic",category_id, function(topic) 
    { 
     $('#topic').empty(); 
     $('#topic').append("<option>--- Select Quiz Topic ---</option>"); 

     for(var t in topic) 
     { 
      var option = $('<option />'); 
      option.attr('value', topic[t].id).text(topic[t].name); 
      $('#topic').append(option); 
     } 

    }); 
}

来源

2014-09-03 16:22:42

感谢您的快速回复..但此代码不适用于我..它不添加生成AJAX请求上的变化事件.. :( – 2014-09-03 16:47:37

恐怕超出了发布的问题。如果显示警告框，那么这个问题的需求已经被填充了，如果你想发表另一个问题，可能在[Code Review]（http://codereview.stackexchange.com/）中，我相信你会得到一个解决方案。 – 2014-09-03 16:57:23

兄弟我已添加警报框只是为了测试目的，无论我的代码是否工作......对不起，我感到困惑 – 2014-09-03 16:58:58

不，你不想调用select元素的onchange。你怎么称呼它在页面加载：

<script src="… jQuery …"></script> 
<script src="http://localhost.dev/public/js/test.js"></script> 
<script type="text/javascript"> 
    jQuery(document).ready(addTopics); 
</script>

如果你想放任何东西该元素的变化监听器，它需要是唯一的function() { var category_id=…; $.getJSON("get_topic",…); }一部分。但你shouldn't use that anyway。

来源

2014-09-03 16:23:30 Bergi

但是，这与OP原本有什么不同呢？命名该函数的价值是什么？（这与你的回答有关，而不是关于OP的目标令人困惑） – Mathletics 2014-09-03 16:24:29

实际上，我认为OP会考虑到根据select元素中选择的类别在一组新的主题中加载更改 – 2014-09-03 16:24:59

@Mathletics ：这并不是很不一样，因为他说代码最初工作正常。据我所知，他只想把它放在外部脚本中。 – Bergi 2014-09-03 16:28:14

谢谢大家的帮助... Atlast我的问题解决了。

function addTopics() 
{ 
    var category_id="category_id="+$("#category").val(); 

    $.getJSON("get_topic",category_id, function(topic) 
    { 
    $('#topic').empty(); 
    $('#topic').append("<option>--- Select Quiz Topic ---</option>"); 

    for(var t in topic) 
    { 
     var option = $('<option />'); 
     option.attr('value', topic[t].id).text(topic[t].name); 
     $('#topic').append(option); 
    } 

}); 
}

请指导我，如果这种方法是错误的......等待某人的建议。

顺便再次感谢所有.. :)

快乐编码。

来源

2014-09-03 16:57:08

如何将匿名jQuery代码转换为命名函数并调用它？

回答

相关问题