我尝试使用radobutton显示/隐藏一个tinymce。喜欢是/否。所以有两个单选按钮。是的 - 将显示微小的mce,不会隐藏这些内容。
我有这个:
显示微小的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 } })
答案 0 :(得分:1)
你遗漏了id属性的@symbol: 修改你的脚本也是这样的:
***编辑关于单选按钮似乎有些事情应该只检查一个,它们应该有相同的名称**
您可以使用#来表示Jquery中的ID而不是按属性查找
编辑我改变了一些事情,我认为你不需要两个单独的id我用类对它们进行分组,你应该能够从该类检查on change事件而不是检查两个id
@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>