如何让javascript多次运行?

编辑:这是一个包含所有代码的jsfiddle。 https://jsfiddle.net/ypbd3fgf/2/

我正在使用这个简单的代码将一个类添加到父元素,以使选定的单选按钮上的文本变为粗体。 但是,它仅适用于页面加载。 如果选择不同的单选按钮,则新选择的按钮不会变为粗体。 我认为这是因为代码只在页面加载时运行。 如何选择新的单选按钮或结帐时更新它? 谢谢!

 $(function() { $(".ez-selected").closest('.row').addClass("bold"); });  

这是HTML。 选择单选按钮时,.ez选择的类将添加到.ez-radio div。 然后在选择其他单选按钮时将其删除。 添加.ez选定的类时,需要将.bold类添加到.row div。 删除.ez选定的类时,需要从.row div中删除.bold类。

  
Option 1

编辑:我添加了下面的JS代码,添加和删除.ez选择的类。 我正在尝试制作的这个新JS只是添加和删除粗体类,当下面的其他JS代码添加和删除.ez选择的类时。

 (function($) { $.fn.ezMark = function(options) { options = options || {}; var defaultOpt = { checkboxCls: options.checkboxCls || 'ez-checkbox', radioCls: options.radioCls || 'ez-radio', checkedCls: options.checkedCls || 'ez-checked', selectedCls: options.selectedCls || 'ez-selected', hideCls: 'ez-hide' }; return this.each(function() { var $this = $(this); var wrapTag = $this.attr('type') == 'checkbox' ? '
' : '
'; if ($this.attr('type') == 'checkbox') { $this.addClass(defaultOpt.hideCls).wrap(wrapTag) .change(function() { if ($(this).is(':checked')) { $(this).parent().addClass( defaultOpt.checkedCls); } else { $(this).parent().removeClass( defaultOpt.checkedCls); } }); if ($this.is(':checked')) { $this.parent().addClass(defaultOpt.checkedCls); } } else if ($this.attr('type') == 'radio') { $this.addClass(defaultOpt.hideCls).wrap(wrapTag) .change(function() { $('input[name="' + $(this).attr( 'name') + '"]').each( function() { if ($(this).is( ':checked')) { $(this).parent().addClass( defaultOpt.selectedCls ); } else { $(this).parent().removeClass( defaultOpt.selectedCls ); } }); }); if ($this.is(':checked')) { $this.parent().addClass(defaultOpt.selectedCls); } } }); } })(jQuery);

编辑:新代码切换到function(){...}格式,并在输入元素上查找单击事件,然后检查它是否为单选按钮,父项是.row然后添加boldez-selected类的单选按钮,并从其他无线电中删除它们。

 $("input").click(function() { if($(this).attr('type') == 'radio' && $(this).parents('.row').length > 0){ $("input").closest('.row').removeClass('bold ez-selected'); $(this).addClass('bold ez-selected'); } }) 

你的代码应该看起来像这样: