Tag: 重构

编辑表单时显示/隐藏持久性,其中单选按钮用于显示/隐藏表单元素

此代码正在运行,但必须有更好的方法在Jquery脚本中执行此操作。 这是我的单选按钮 ‘lc’ %>Cash ‘rb’ %>Asset ‘ab’ %>Supplies 而且现在我隐藏了一下。 A drop down list to be shown 而Jquery部分 $j(document).ready(function(){ $j(“input[id=’lc’]”).change(function() { $j(“#asset_list”).hide(); } ); $j(“input[id=’rb’]”).change(function() { $j(“#asset_list”).show(“slide”); } ); $j(“input[id=’ab’]”).change(function() { $j(“#asset_list”).hide(); } ); } ); 在选中的单选按钮上呈现标记 虽然它有效,但我确信有更好的方法可以做到这一点,所以我会要求重构帮助。 提前谢谢了 ED1。 我已经意识到这是一个Jquery问题,需要它来检查是否检查了“input [id =’rb’]”(来自db)然后检查$ j(“#asset_list”)。show(); 无需更改监听器

压缩重复的jQuery函数

我正在寻找一种方法来减少我的jQuery函数的膨胀,将重复的函数组合成一个封面的所有脚本。 我有一系列类别按钮,点击后,过滤元素列表,只显示与匹配类别对应的元素。 我的代码工作正常,但每个’类别’重复11次,为页面添加了一些严重的膨胀。 ||| JSFiddle在这里 ||| 其中一个function的样本如下…… $(‘#toggle-greendeal’).click(function() { $(‘.update-greendeal’).show(200); $(‘.update-broker’).hide(200); $(‘.update-cases’).hide(200); $(‘.update-training’).hide(200); $(‘.update-collections’).hide(200); $(‘.update-debt’).hide(200); $(‘.update-wealth’).hide(200); $(‘.update-business’).hide(200); $(‘.update-solar’).hide(200); $(‘.update-pension’).hide(200); $(‘.update-welfare’).hide(200); $(‘#toggle-all’).addClass(‘toggle-inactive’); $(‘#toggle-broker’).addClass(‘toggle-inactive’); $(‘#toggle-cases’).addClass(‘toggle-inactive’); $(‘#toggle-training’).addClass(‘toggle-inactive’); $(‘#toggle-collections’).addClass(‘toggle-inactive’); $(‘#toggle-debt’).addClass(‘toggle-inactive’); $(‘#toggle-wealth’).addClass(‘toggle-inactive’); $(‘#toggle-business’).addClass(‘toggle-inactive’); $(‘#toggle-solar’).addClass(‘toggle-inactive’); $(‘#toggle-pension’).addClass(‘toggle-inactive’); $(‘#toggle-welfare’).addClass(‘toggle-inactive’); $(‘#toggle-greendeal’).removeClass(‘toggle-inactive’); return false; }); 函数的第一部分显示正确类别类中的div,并隐藏所有其他非匹配类。 第二部分“灰显”除了单击的按钮之外的所有按钮。 代码重复#toggle-greendeal , #toggle-broker , #toggle-cases , #toggle-training , #toggle-collections , #toggle-debt , #toggle-wealth , #toggle-business , #toggle-solar , […]

使用jQuery .each()时,是否可以使用非匿名函数?

我有这个代码块,我发现特别长,难以理解:调用堆栈充满了隐含的函数和隐含的添加到它的参数。 换句话说,我想通过将每个中调用的函数与每个函数分开来澄清我的代码。 看那个例子: $(xml).find(‘group’).each(function () { var groupName = $(this).attr(‘name’); // There is here around 100 lines of codes I would like to split in // at least five functions, And I’m sure it is possible to use named functions // instead of implicit ones, no ?

动态检查单选按钮的值(重构问题)

我在很大程度上基于这里的例子写了这个jsfiddle。 这个例子超过2年,所以我想知道是否有一种更简单的方法来检查单选按钮的值,而不是if, elseif, else语句的if, elseif, else 。 我的价值观将被disabled, both, footer, header ,只有四个不太糟糕。 我只是想学习如何编写更好的Javascript。 HTML: 1 2 3 Div 1 Content Div 2 Content Div 3 Content 使用Javascript: $(‘#div_1,#div_2,#div_3’).css(‘display’,’none’); $(“input[name=rdio]”).change(function() { if ($(“input[name=rdio]:checked”).val() == ‘1’) { $(‘#div_1’).show(); $(‘#div_2,#div_3′).hide(); } else if ($(“input[name=’rdio’]:checked”).val() == ‘2’) { $(‘#div_2’).show(); $(‘#div_1,#div_3’).hide(); } else { $(‘#div_3’).show(); $(‘#div_2,#div_1’).hide(); } }); JSFiddle来玩: http […]

用Javascript编程OOP – 正确

我很有兴趣改进我的javascript代码以正确OOP ….目前我倾向于做这样的事情: jQuery(document).ready(function () { Page.form = (function () { return { //generate a new PDF generatePDF: function () { }, //Update the list of PDFs available for download updatePDFDownloads: function () { }, /* * Field specific functionality */ field: (function () { return { //show the edit prompt edit: function (id, name) { […]

jQuery动态创建table / tr / td等,并追加属性

在一个例子中我有这个结构(小例子): Test1LINKTest11 Test2LINKTest22 Test3LINKTest33 在jQuery中,我会动态创建它: var test = “” + “”…. 等等…(很多其他的东西要写)。 之后我会追加它: $(“.somePlaceInHtml”).append(test); 那么还有其他方法用jQuery动态编写这样的结构吗? 这对我来说是一个问题,因为我的结构很大,不像我在示例中所示的那么小。 主要原因是我想为自己和维护此代码的其他开发人员提供更好的可读性。