2013-05-13 52 views
-1

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

HTML代码..

<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;*/ 
      } 
     } 

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

请帮助..在小提琴

+0

是小提琴为你工作与文本框? – 2013-05-13 08:29:58

+0

是的...但是当我尝试使用代码的文本区域,那么它不工作..你可以看到链接来验证.. – Lucy 2013-05-13 08:32:20

+0

你试过'$(“textarea:eq(”+(index)+ “)”)'? – 2013-05-13 08:33:29

回答

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(); 
} 
+0

如果我在Jquery UI自定义对话框中显示文本区域以从用户获取输入并显示工具提示,请问这项工作吗? – Lucy 2013-05-13 09:06:08

+0

@Lucy:是的,它会工作,但需要使用适当的选择器来定制对话框和textarea。 :) – vijay 2013-05-13 09:44:41

0

您可以更改input:input

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

Demo Fiddle

+0

@Archer':input'可以选择所有表单元素,我希望你知道它。 – Jai 2013-05-13 08:40:33

+0

如果我在Jquery UI自定义对话框中显示文本区域以从用户获取输入,然后显示工具提示,请问这是否工作? – Lucy 2013-05-13 09:08:17