提交表单在 Firefox 中运行良好，但不能在 Safari 中运行良好

Question

我已经在我的消息系统中添加了一个Javascript代码。当用户单击提交按钮时，此JS代码在文本区域中添加了一行BBCode。

BBCode在Firefox和Safari中都可以很好地插入。但是，该消息仅在Firefox中传递。使用 Safari 发布时，它不会进入数据库。我只用这两个浏览器对此进行了测试，很可能它被其他浏览器破坏了。

这是代码：

<!-- Start javascript code for message type -->
<script>
    var messageType = {
        General: "[b][green]General[/green]:[/b]",
        News: "[b][blue]News[/blue]:[/b]",
        Trend: "[b][orange]Trend[/orange]:[/b]",
        Help: "[b][red]Help[/red]:[/b]"
    };
    function submitForm(){
        msgSelText = messageType [document.getElementById('messageSelection').value]
        document.getElementById('wpam_nm_text').value = msgSelText + ' ' +document.getElementById('wpam_nm_text').value;
        document.getElementById('new_post_form').submit();
    }
</script>
<!-- End javascript code for message type -->
<form name="new_post" method="post" action="admin.php?page=wp-admin-microblog/wp-admin-microblog.php" id="new_post_form">
    <table class="widefat">
        <thead>
        <tr>
            <td>
                <div id="postdiv" class="postarea" style="display:block;">
                    <textarea name="wpam_nm_text" id="wpam_nm_text" style="width:100%;" rows="4"></textarea>
                </div>
                Type of message:
                <select id="messageSelection">
                    <option>General</option>
                    <option>News</option>
                    <option>Trend</option>
                    <option>Help</option>
                </select>
                <p style="text-align:right; float:right;"><input name="send" type="submit" class="button-primary" value="<?php _e('Send', 'wp_admin_blog'); ?>" onclick="submitForm()" />
            </td>
        </tr>
        </thead>
    </table>
</form>

我删除了Javascript代码，表单在Safari中运行良好。这意味着不知何故，JS代码使其无法正常工作 - 为什么？我该如何解决它？

Answer 1

在 Safari 中，当我运行这个小提琴时，我收到一个引用错误：http://jsfiddle.net/esCPN/1/

如果你打算使用onclick来触发javascript evens（你不应该这样做），那么你应该使用javascript:语法。

<input name="send" type="submit" class="button-primary" value="Send"
    onclick="javascript:submitForm()" />

这将停止 Safari 引发的任何引用错误。

Answer 2

我通过完全重写 JavaScript 代码解决了上帝遗弃的事情，现在在两个浏览器中都可以正常工作。我不知道原始方法出了什么问题，并非完全不可能是浏览器错误。

以下是新方法：

<!-- Start javascript code for message type -->
<script type="text/javascript">
function setText(){
  var messageType = document.getElementById('messageType');
   var feed = document.getElementById('feed');
    feed.value= messageType.value + " "  +
    feed.value;
    }
</script>
<!-- End javascript code for message type -->
<form name="new_post" method="post" action="admin.php?page=wp-admin-microblog/wp-admin-microblog.php" id="new_post_form">
    <table class="widefat">
        <thead>
        <tr>
            <th><?php _e('Your Message', 'wp_admin_blog');?><a name="newpost"></a></th>
        </tr>
        <tr>
            <td>
                <div id="postdiv" class="postarea" style="display:block;">
                    <textarea name="wpam_nm_text" id="feed" style="width:100%;" rows="4"></textarea>
                </div>
                Type of message:
                 <select id="messageType" style="width:100px; height:20px; text-align:center;">
                     <option value="[b][green]General[/green]:[/b]">General</option>
                     <option value="[b][blue]News[/blue]:[/b]">News</option>
                     <option value="[b][orange]Trend[/orange]:[/b]">Trend</option>
                     <option value="[b][red]Help[/red]:[/b]">Help</option>
                </select>
                <p style="text-align:right; float:right;"><input name="send" type="submit" class="button-primary" value="<?php _e('Send', 'wp_admin_blog'); ?>" onclick="javascript:setText()" /></p>
            </td>
        </tr>
        </thead>
    </table>
</form>