最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to focus cursor in between two brackets (parentheses) with Jquery? - Stack Overflow

programmeradmin8浏览0评论

I have a calculator that works with buttons to assign values. The main idea is to generate formulas. The values are added seamlessly into an "input". All the brackets when entering your respective button, I need to happen is to continue entering values in the parenthesis

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>    

With that code this happen: 5+()3*()+5+3 and I need: 5+(3*(5+3))

How can I do that?

I have a calculator that works with buttons to assign values. The main idea is to generate formulas. The values are added seamlessly into an "input". All the brackets when entering your respective button, I need to happen is to continue entering values in the parenthesis

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>    

With that code this happen: 5+()3*()+5+3 and I need: 5+(3*(5+3))

How can I do that?

Share Improve this question edited Nov 20, 2014 at 20:51 TuGordoBello asked Nov 20, 2014 at 16:34 TuGordoBelloTuGordoBello 4,5109 gold badges57 silver badges88 bronze badges 2
  • 6 Hey, could you throw that into a jsfiddle? – Phil Tune Commented Nov 20, 2014 at 20:54
  • 1 Maybe try changing the question title. You're asking about string operations, not about cursor and/or focus. – hon2a Commented Nov 26, 2014 at 11:02
Add a ment  | 

7 Answers 7

Reset to default 2 +50

You use the following code to make it work

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);
        }
    }
});

demo link : http://jsfiddle/asimshahiddIT/6hje7nvh/

You can do 2 ways.

Can separate the '(' button from ')' or you can try this:

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);

Create two buttons instead of one, one for ( and one for ) and you will have no problem.

You can do it like this

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

});

you can use '(' and ')' it be better than '()' http://jsfiddle/mazin/7yj20umu/

  $(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);
            }
        }
    });
});
<script src="https://ajax.googleapis./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>

Simply add a flag for the insert point position. And don't forget to reset it when necessary.

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

You don't want to put a single () button on your calculator, because this prevents you from leaving the parentheses and continuing the formula. Just create two separate buttons ( and ) and maybe add some code for counting the number of open parentheses (to finish the formula for the user automatically when pressing = and to prevent adding ) when there is no open ().

发布评论

评论列表(0)

  1. 暂无评论