Jquery Selector获取文本区域的值

时间:2013-05-13 08:27:17

标签: javascript jquery jquery-selectors highcharts

我想获取多个textarea的值并将它们显示为highcharts graph的工具提示。我使用输入和eq选择器来获取多个文本区域的值,但这些值不会作为工具提示返回..

HTML code ..

<div id="dialog" title="Input Data">
<form id="pForm" >
 <!--name: <input type="text" name="name" width='50' height='100' maxlength="10" placeholder="Fill in your data" /><br><br>-->

<label for="txt1">Data 1:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt1"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 1"></textarea><br><br>

<label for="txt2">Data 2:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt2"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 2"></textarea><br><br>

<label for="txt3">Data 3:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <textarea id="txt3"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 3"></textarea><br><br>

<label for="txt4">Data 4:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt4"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 4"></textarea><br><br>

<label for="txt5">Data 5:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt5"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 5"></textarea><br><br>

<label for="txt6">Data 6:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt6"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 6"></textarea><br><br>

<label for="txt7">Data 7:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt7"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 7"></textarea><br><br>

<label for="txt8">Data 8:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt8"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 8"></textarea><br><br>

<label for="txt9">Data 9:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt9"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 9"></textarea><br><br>

<label for="txt10">Data 10:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt10"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 10"></textarea><br><br>

<label for="txt11">Data 11:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt11"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 11"></textarea><br><br>

<label for="txt12">Data 12:</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<textarea id="txt12"rows="2" cols="10" name="ar2" maxlength="20" style="resize:none" placeholder="Data 12"></textarea><br><br>


&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="button" value="OK" onclick="getdata()" />
<input type="button" value="cancel" onclick="getPdata( this.value )" />
</form>
</div>

Javascript代码..

             tooltip: {
            enabled: true,
            formatter: function() {

            var serieI = this.series.index;
                        var index = dataValues.indexOf(this.y);
                        var index1= dataValues2.indexOf(this.y);
            debugger;
            var comment = "";
            if (serieI == 0) {
                comment = $("input:eq(" + (index) + ")").val();

            } else {

                comment = $("input:eq(" + (index1) + ")").val();

            }
            return 'The value for, <b>' + this.x +
                '</b> is <b>' + this.y + '</b>' + comment;

                          //return '<b>'+ myText[this.point.x] +'</b>';

                    /*var index = dataValues.indexOf(this.y);
                    var comment=$("input:eq("+(index)+")").val()
                    return 'The value for <b>'+ this.x +
                    '</b> is <b>'+ this.y +'</b> -->'+comment;*/
            }
        }

我无法理解错误..小提琴也在这里http://jsfiddle.net/RbenU/8/在这个小提琴文本框已被使用,而我想使用文本区域..

请帮助..

2 个答案:

答案 0 :(得分:3)

检查小提琴上的样本 http://jsfiddle.net/RbenU/10/

使用textarea作为选择器而不是输入如下

if (serieI == 0) {
      comment = $("textarea:eq(" + (index) + ")").val();
} else {
      //comment = "second serie matched!";
      comment = $("textarea:eq(" + (index1) + ")").val();
}

答案 1 :(得分:0)

您可以将input更改为:input

comment = $(":input:eq(" + (index) + ")").val();
comment = $(":input:eq(" + (index1) + ")").val();

Demo Fiddle