我的选择表单中的 Javascript 不适用于文本区域字段

Question

你好，我已经用尽了所有关于这个问题的答案，但没有什么能回答我正在寻找的问题。

我有一个留言板，我想在其中使用静态 html 创建一个充满预制模板的下拉菜单。这个想法是这样的:张贴者想要从表单下拉菜单中将预制的 html 标签加载到他们的消息正文中。我让它与 Firefox 完美配合......但当然，IE 不支持 onclick 调用 javascript。在我的研究中，我不知疲倦地尝试在调用我的 javascript 时获取 onchange，但我似乎无法让它工作._。任何帮助，将不胜感激!谢谢。

以下是在 Firefox 中工作的 js 和表单。这里没有显示的是有一个文本区域，其中填充了脚本引发的值。

JAVASCRIPT:

function add_event_setup()
{
document.dataform.bodytext.value += "<center><img src=\"../../images/kick_ass_title.jpg\"><br><span class=\"event_title\">INSERT TEXT</span><br><br><table width=\"500\" bgcolor=\"#FF0000\"><tr><td bgcolor=\"#000000\"></td></tr></table></center>";
}


THE FORM:

<select class="formselect">
  <option value="Setup" class="formselect">--Setup--</option>
  <option value="Setup1" onclick="add_event_setup()" style="border: 1px solid gray" class="formselect">Setup 1</option>
</select>

Answer 1

尝试以下 3 种方法之一:

第一种方式

JavaScript

 function add_event_setup(selectElement) {

var val = selectElement.value;

if(val == "TF")
    alert("DO THIS");
else if(val == "JR")    
    alert("DO THAT");
else
    alert("something else"); }

HTML

<select class="formselect" onchange="add_event_setup(this);"> 
    <option value="Game Terms" class="formselect">--Game Terms--</option>
    <option value="TF" style="border: 1px solid gray" class="formselect">TimeFrame</option>
    <option value="JR" style="border: 1px solid gray" class="formselect">Jim Ross</option>
</select>

第二种方式

HTML + JavaScript (确保script标签放在select标签之后，如下图)

<select id="myform" class="formselect"> 

    <option value="Game Terms" class="formselect">--Game Terms--</option>
    <option value="TF" style="border: 1px solid gray" class="formselect">TimeFrame</option>
    <option value="JR" style="border: 1px solid gray" class="formselect">Jim Ross</option>
</select> 
<script>
document.getElementById("myform").addEventListener("change", function() {

    var val = this.value;

    if(val == "TF") {

        alert("DO THIS");
    } else if(val == "JR") {

        alert("DO THAT");

        } else
         alert("something else");


        }, false);
        </script>

第三种方式

以防万一你使用 jQuery :

JavaScript

    var MySelector = {

        setup : function() {

            $('#myform').bind('change', function() {

                var val = $(this).val();

                if(val == "TF") {

                    alert("DO THIS");
                } else if(val == "JR") {

                    alert("DO THAT");

                } else
                     alert("something else");           

            });

        }

    };

    $(document).ready(function() {

        MySelector.setup();
    });

HTML

    <select id="myform" class="formselect"> 

        <option value="Game Terms" class="formselect">--Game Terms--</option>
        <option value="TF" style="border: 1px solid gray" class="formselect">TimeFrame</option>
        <option value="JR" style="border: 1px solid gray" class="formselect">Jim Ross</option>
    </select>