Show/hide 带有单选按钮的 tinymce

Question

我尝试 show/hide 带有 radobutton 的 tinymce。喜欢yes/no。所以有两个单选按钮。 yes - 会显示 tiny mce，no 会隐藏 tinymce。

我有这个：

显示微型 mce:

<div class="form-group">
    @Html.Label(Resources.Entity.Product.PdfMessage, new { @class = "text-bold control-label col-md-2" })
    <div class="col-lg-6 col-md-8 col-sm-10 ">
        @Html.EditorFor(model => mailModel.PdfMessage, new { htmlAttributes = new { @class = "form-control tiny-mce", data_lang = System.Globalization.CultureInfo.CurrentUICulture.Name, id = "tinyMCE" } })
        @Html.ValidationMessageFor(model => mailModel.PdfMessage)
        @*@Html.TextArea("MailProductHandlers_message", mailModel.Message, new { @class = "form-control", @rows = 15 })*@
    </div>
</div>

这些是我的单选按钮：

<div class="form-group">
    @Html.Label(Resources.Entity.Product.GeneratePDF, new {@class = "text-bold control-label col-md-2" })
    <div class="col-lg-6 col-md-8 col-sm-10 ">

        @Html.Label(Resources.Entity.Product.GeneratePDFYes)  @Html.RadioButtonFor(model => model.IsChecked, "Yes", new { @checked = true, id = "radioButton" })
        @Html.Label(Resources.Entity.Product.GeneratePDFNo)  @Html.RadioButtonFor(model => model.IsChecked, "No", new { @checked = true, id = "radioButton2" })

    </div>
</div>

这是我的 javascript:

<script>
    $(document).ready(function () {
        $("input[Id='radioButton']").click(function () {
            if ($(this).is(':checked')) {
                $('#tiny-mce').show();
            }
            else {
                $('#tiny-mce').hide();
            }
        });
    });
</script>

如果我这样做：$('#mceu_61').hide(); 它会隐藏编辑器。但在我按下是之后，它会显示编辑器。但如果我再按否，它就不会再隐藏了。我有这个：

@Html.EditorFor(model => mailModel.PdfMessage, new { htmlAttributes = new { @class = "form-control tiny-mce", @id = "mceu_61", data_lang = System.Globalization.CultureInfo.CurrentUICulture.Name } })

Answer 1

您缺少 id 属性的 @symbol：像这样修改你的脚本：

***编辑关于单选按钮的一些事情似乎不对劲只有一个应该被选中并且它们应该具有相同的名称**

顺便说一句，你可以用#来表示和ID在Jquery中，而不是通过属性查找

编辑我改变了一些东西，我不认为你需要两个单独的 id 我用 class 将它们分组，你应该能够检查 on change 事件class 而不是检查两个 ids

@Html.EditorFor(model => mailModel.PdfMessage, new { htmlAttributes = new { @class = "form-control tiny-mce", @id = "tinyMCE", @data_lang = System.Globalization.CultureInfo.CurrentUICulture.Name  } })


@Html.RadioButtonFor(model => model.IsChecked, "Yes", new { @checked = true, @class = "pdfchecker" })

// only one should be checked
@Html.RadioButtonFor(model => model.IsChecked, "No", new { @checked = false, @class = "pdfchecker" })



<script>
    // this is short hand for document ready
    $(function () {
        //# is to denote an ID, . is to denote a class in jQuery the change function is hit when a radio button is change check the name to make sure they are apart of the same grouping
        $(".pdfchecker").change(function () {
            if ($(this).is(':checked')) {
                $('#tiny-mce').show();
            }
            else {
                $('#tiny-mce').hide();
            }
   });






</script>

Show/hide 带有单选按钮的 tinymce

Show/hide tinymce with radio buttons

c#

asp.net

asp.net-mvc

tinymce