如何使用Jquery将光标聚焦在两个括号(括号)之间?

时间:2014-11-20 16:34:53

标签: javascript jquery html5 calculator

我有一个计算器,可以使用按钮来分配值。主要思想是生成公式。这些值无缝地添加到“输入”中。输入相应按钮时的所有括号,我需要继续在括号中输入值

enter image description here

Jquery的

    $(document).ready(function () {
    $("input:button").click(function () {
        valor = $(this).val();
        actual = $("#ContentPlaceHolder1_formula").val();
        if (valor == "C") {
            $("#ContentPlaceHolder1_formula").val("");
        } else {
            if (valor == "=") {
                $("#ContentPlaceHolder1_formula").val(eval(actual));
            } else {
                $("#ContentPlaceHolder1_formula").val(actual + valor);
            }
        }
    });
});

HTML

                    <div class="form-group">
                    <input class="btn" type="button" value="()" id="parentesis" />
                    <input class="btn" type="button" value="1" id="1" />
                    <input class="btn" type="button" value="2" id="2" />
                    <input class="btn" type="button" value="3" id="3" />
                    <input class="btn" type="button" value="+" id="sumar" /><br />
                    <input class="btn" type="button" value="4" id="4" />
                    <input class="btn" type="button" value="5" id="5" />
                    <input class="btn" type="button" value="6" id="6" />
                    <input class="btn" type="button" value="-" id="restar" /><br />
                    <input class="btn" type="button" value="7" id="7" />
                    <input class="btn" type="button" value="8" id="8" />
                    <input class="btn" type="button" value="9" id="9" />
                    <input class="btn" type="button" value="*" id="multiplicar" /><br />
                    <input class="btn" type="button" value="0" id="0" />
                    <input class="btn" type="button" value="=" id="igual" />
                    <input class="btn" type="button" value="C" id="C" />
                    <input class="btn" type="button" value="/" id="dividir" />
                    <asp:Button ID="btn_login" OnClick="docreateformula" CssClass="btn btn-primary btn-lg center-block" Text="Guardar" runat="server"/>
                </div>    

使用该代码会发生这种情况: 5+()3*()+5+3 我需要: 5+(3*(5+3))

我该怎么做?

7 个答案:

答案 0 :(得分:2)

使用以下代码使其正常工作

function occurrences(string, subString, allowOverlapping) {

    string+=""; subString+="";
    if(subString.length<=0) return string.length+1;

    var n=0, pos=0;
    var step=(allowOverlapping)?(1):(subString.length);

    while(true){
        pos=string.indexOf(subString,pos);
        if(pos>=0){ n++; pos+=step; } else break;
    }
    return(n);
}

$("input:button").click(function () {
    valor = $(this).val();
    actual = $("#ContentPlaceHolder1_formula").val();
    if (valor == "C") {
        $("#ContentPlaceHolder1_formula").val("");
    }
    else if(valor=="()")
    {
   var count1= occurrences(actual,'(',false);
   var count2= occurrences(actual,')',false);
        var count=count1+count2;
        if(count%2==0)  { $("#ContentPlaceHolder1_formula").val(actual+"("); 
                        } 
        else {
       $("#ContentPlaceHolder1_formula").val(actual+")"); 
        }
                }
    else {
        if (valor == "=") {
            $("#ContentPlaceHolder1_formula").val(eval(actual));
        } else {
            $("#ContentPlaceHolder1_formula").val(actual + valor);
        }
    }
});

演示链接:http://jsfiddle.net/asimshahiddIT/6hje7nvh/

答案 1 :(得分:1)

你可以做两种方式。

可以将&#39;(&#39;按钮与&#39;分开)&#39;或者你可以试试这个:

if(valor=="()"){
  for(i=0;i<actual.lenght;i++){
  var aux = actual.IndexOf("(",i);
  if(aux){
    var aux2 = actual.IndexOf(")");
    if(aux2){
      i=aux2-1;
    }else{
      valor=")";
    }else{
      valor="(";
    }
$("#ContentPlaceHolder1_formula").val(actual + valor);

答案 2 :(得分:1)

创建两个按钮而不是一个按钮,一个用于(,另一个用于),您将没有任何问题。

答案 3 :(得分:1)

你可以这样做

$(document).ready(function () {
    var opened=0;
    $("input:button").click(function () {
        valor = $(this).val();
        actual = $("#ContentPlaceHolder1_formula").val();
        if (valor == "C") {
            $("#ContentPlaceHolder1_formula").val("");
        } else {
            if (valor == "=") {
                $("#ContentPlaceHolder1_formula").val(eval(actual));
            } else {        
                $("#ContentPlaceHolder1_formula").val(actual + valor);
                if(valor=="()") {
                    input = $("#ContentPlaceHolder1_formula");
                    input[0].selectionStart = input[0].selectionEnd = input.val().length - 1;
                }
            }
        }
    });

});

答案 4 :(得分:1)

您可以使用&#39;(&#39;和&#39;)&#39;它比&#39;()&#39;更好 http://jsfiddle.net/mazin/7yj20umu/

&#13;
&#13;
  $(document).ready(function () {
    $("input:button").click(function () {
     valor=$(this).val();
        actual = $('#btn_login').val();
        if (valor == "C") {
            $('#btn_login').val("");
        } else {
            if (valor == "=") {
                $('#btn_login').val(eval(actual));
            } else {
                $('#btn_login').val(actual + valor);
            }
        }
    });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group">
                    <input class="btn" type="button" value=")" id="parentesis" />
                              <input class="btn" type="button" value="(" id="parentesis" />

                    <input class="btn" type="button" value="1" id="1" />
                    <input class="btn" type="button" value="2" id="2" />
                    <input class="btn" type="button" value="3" id="3" />
                    <input class="btn" type="button" value="+" id="sumar" /><br />
                    <input class="btn" type="button" value="4" id="4" />
                    <input class="btn" type="button" value="5" id="5" />
                    <input class="btn" type="button" value="6" id="6" />
                    <input class="btn" type="button" value="-" id="restar" /><br />
                    <input class="btn" type="button" value="7" id="7" />
                    <input class="btn" type="button" value="8" id="8" />
                    <input class="btn" type="button" value="9" id="9" />
                    <input class="btn" type="button" value="*" id="multiplicar" /><br />
                    <input class="btn" type="button" value="0" id="0" />
                    <input class="btn" type="button" value="=" id="igual" />
                    <input class="btn" type="button" value="C" id="C" />
                    <input class="btn" type="button" value="/" id="dividir" />
          <input ID="btn_login" type="text" OnClick="docreateformula" CssClass="btn btn-primary btn-lg center-block" Text="Guardar"/>
</div>
&#13;
&#13;
&#13;

答案 5 :(得分:1)

只需为插入点位置添加标记即可。并且不要忘记在必要时重置它。

$(document).ready(function () {
    var flag = 0; // the insert point
    $("input:button").click(function () {
        valor = $(this).val();
        actual = $("#ContentPlaceHolder1_formula").val();
        if (valor == "C") {
            $("#ContentPlaceHolder1_formula").val("");
            flag = 0; // reset the flag
        } else if (valor == "=") {
            $("#ContentPlaceHolder1_formula").val(eval(actual));
            flag = 0; // reset the flag
        } else {
            // split current valor at the insert point and concat with insertion
            $("#ContentPlaceHolder1_formula").val(actual.slice(0, flag) + valor + actual.slice(flag)); 
            flag++; // increase flag by 1
        }
    });
});

答案 6 :(得分:0)

您不想在计算器上放置一个()按钮,因为这会阻止您离开括号并继续使用公式。只需创建两个单独的按钮(),然后可以添加一些代码来计算打开括号的数量(在按=时自动完成用户的公式并防止添加{{} 1}}当没有打开))时。