使禁用的单选按钮不灰显（表现为只读）

Question

我有用户请求修改 Microsoft CRM 以使其只读字段不灰显，但仍为只读。通过检查 DOM，我了解到单选控件被设置为禁用。为了完成这个请求，我无法更改应用程序生成 html 的方式。但是，我确实有能力在表单 onload 事件上运行 javascript 函数。我尝试了几种不同的方法，最近我尝试使用 jQuery 删除 disabled 属性并将事件处理程序附加到收音机以在用户尝试更改它们时将它们的值改回。

使用这种方法，我了解到 change 事件会在用户单击的控件上触发，但不会在因选择同一组中的另一个单选按钮而未选中的单选按钮上触发。

为了解决这个问题，我尝试为所有单选控件编写一个自定义属性，以记录在页面加载时它是否被选中，然后是一个事件处理程序，它将每个带有自定义属性的单选按钮上的选中属性重置为任何单选按钮的更改事件触发时的原始值。但是，这种方法对我也不起作用。我将包含一个示例应用程序来展示我的方法。我将不胜感激帮助修复我的代码，或帮助使用不同的方法满足这些需求。

对于我提出的任何解决方案，我都想再次重申要求。

1. 只需将解决方案写入 IE。
2. 我无法控制生成的 HTML，只能编写 javascript。
3. 设置为禁用的字段需要呈现为黑色，而不是灰色。

4. 用户不得更改这些字段的值。

   <script src="js/jquery.1.6.4.min.js" type="text/javascript"></script>
   <script type="text/javascript">
       $(document).ready(function () {
           //Set custom attribute for disabled checked radio's
           $('input:radio:disabled:checked').attr('custom:bmiChecked', "true");
           //set custom attribute for disabled unchecked radio's
           $('input:radio:disabled:not(:checked)').attr('custom:bmiChecked', "false");
           //select disabled radio's and then filter to radio's that have the custom attribute set
           $('input:radio:disabled').filter(function () {
               return $(this).attr('custom:bmiChecked');
           }).each(function () {
               //attach a click event handler
               $(this).click(function () {
                   //In the event handler select all radio's that have the bmiChecked attribute
                   $('input:radio').filter(function () {
                       return $(this).attr('custom:bmiChecked');
                   }).each(function () {
                       //For each of these radio's set their checked property to the original value from the page load.
                       if ($(this).attr('custom:bmiChecked') == "true") {
                           $(this).attr('checked', "").css({ 'border': '5px solid green' });
                       }
                       else {
                           $(this).attr('checked', "checked").css({ 'border': '5px solid red' });
                       }
                   });
               });
           });
           //remove all the disabled properties from radiobutton's
           $('input:radio:disabled').prop('disabled', false);
       });
   </script>
   
   
   <input name="rad_new_bitfield2options" tabindex="1090" class="ms-crm-RadioButton" disabled="" id="Radio2" style="margin-left: 0px;" type="radio" value="1" checked="checked" />
   
   <input name="rad_new_bitfield2options" tabindex="1090" class="ms-crm-RadioButton" disabled="" id="Radio3" type="radio" value="2"  />
   

Answer 1

正如@cdeszaq 指出的那样，这不是一个非常漂亮的解决方案。 但是您需要做的就是“重新检查”最初选中的按钮。 Working Fiddle.

Answer 2

您可以让您的 javascript 将表单字段替换为其他 html 元素，例如包含相同数据的 <p> 元素。

这解决了禁用表单元素的需要，至少对我来说，这更有意义。如果用户无论如何都无法更改这些值，那为什么还要让它们成为表单元素呢？

处理尝试拦截事件并采取措施阻止正常行为也更简单。