Question

我曾尝试在我的ascx用户控件中制作雅虎富文本编辑器，但即使在获得雅虎开发者协会的帮助后，我也失败了。

这里我用它做了什么。

1）我创建了ascx用户控件并粘贴文本区域html代码

<div class="yuieditor">

<form method="post" action="#" id="form1"> 
    <textarea id="myEditor" name="editor" rows="20" cols="75"> 

    </textarea> 
    </form>
</div>

2）我从yahoo为我的富文本编辑器初始化了yahoo css和javascript。

<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.7.0/build/assets/skins/sam/skin.css"/>
<!-- Utility Dependencies -->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script>
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container_core-min.js"></script>
<script  type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/menu/menu-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/editor/editor-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script>
<script type="text/javascript" src="/wp-content/uploads/2007/10/yui-image-uploader26.js"></script>
<script  type="text/javascript">
    var myEditor = new YAHOO.widget.Editor('example_editor', {
        height: '300px',
        width: '522px',
        dompath: true,
        animate: true
    });
    yuiImgUploader(myEditor, 'example_editor',
'/wp-content/uploads/2007/12/yui_img_uploader.php', 'image');
    myEditor.render();
</script>

但它不能正常工作:(我很沮丧地使用它，但我不想使用任何其他编辑器，我只想使用它。

请帮忙。

这是我的ascx上的完整代码。

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="yui.ascx.cs" Inherits="YUI.yui" %>

<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css"
href="http://yui.yahooapis.com/2.7.0/build/assets/skins/sam/skin.css"/>
<!-- Utility Dependencies -->
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.7.0/build/element/element-min.js"></script>
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/container/container_core-min.js"></script>
<script  type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/menu/menu-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/editor/editor-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.7.0/build/connection/connection-min.js"></script>
<script type="text/javascript" src="/wp-content/uploads/2007/10/yui-image-uploader26.js"></script>
<script  type="text/javascript">
    var myEditor = new YAHOO.widget.Editor('example_editor', {
        height: '300px',
        width: '522px',
        dompath: true,
        animate: true
    });
    yuiImgUploader(myEditor, 'example_editor',
'/wp-content/uploads/2007/12/yui_img_uploader.php', 'image');
    myEditor.render();
</script>
<div class="yuieditor">

<form method="post" action="#" id="form1"> 
    <textarea id="myEditor" name="editor" rows="20" cols="75"> 

    </textarea> 
    </form>
</div>

请帮助我解释为什么这不起作用。

Answer 1

您的代码中未使用正确的控件ID，请尝试以下操作：

更改

 new YAHOO.widget.Editor('example_editor',

到

 new YAHOO.widget.Editor('myEditor',

更新您的代码，使用正确的ID - myEditor代替代码的其他部分example_editor

同时更改您的代码以使用yui-skin-sam课程，而不是yuieditor

例如：

<div class="yui-skin-sam">

工作代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<!-- Skin CSS file -->
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.9.0/build/assets/skins/sam/skin.css">
<!-- Utility Dependencies -->
<script src="http://yui.yahooapis.com/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
<script src="http://yui.yahooapis.com/2.9.0/build/element/element-min.js"></script> 
<!-- Needed for Menus, Buttons and Overlays used in the Toolbar -->
<script src="http://yui.yahooapis.com/2.9.0/build/container/container_core-min.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/menu/menu-min.js"></script>
<script src="http://yui.yahooapis.com/2.9.0/build/button/button-min.js"></script>
<!-- Source file for Rich Text Editor-->
<script src="http://yui.yahooapis.com/2.9.0/build/editor/editor-min.js"></script>
<script  type="text/javascript">
    var myEditor = new YAHOO.widget.Editor('myEditor', {
        height: '300px',
        width: '522px',
        dompath: true,
        animate: true
    });

    myEditor.render();
</script>
</head>
<body>
<div class="yui-skin-sam">

<form method="post" action="#" id="form1"> 
    <textarea id="myEditor" name="editor" rows="20" cols="75"> 

    </textarea> 
    </form>
</div>
</body>

雅虎富文本编辑器与Asp.net无法正常工作

1 个答案: