Regexp Test my two cents on JS regexes

Regular Expressions Tool

Usage: test regexes in two simple steps

1. Write the regex pattern in the upper input box
2. Write the string against with the pattern will be matched in the text area below the options

When a match is obtained, the results will be show in the status area, otherwise it will show "NO MATCH"

Results explanation:
The main expression matched will appear in a blue label. If there are captured groups, consequent subexpressions will appear in a green label. For groups that aren't matched you get a red label stating "Null". Try this with the chess move pattern, writing for example "Nf3", which is a valid chess move, and see the results
If the Global option is checked, you just get a blue label for each time the main expression is matched in the provided string, so no green or red labels in this case.

The three checkboxes are related to Javascript regexp flags, that is "global - g", "case insensitive -i" and "multiline - m". Just go ahead and try them, along with the example patterns provided.
If you want to learn more about Javascript regexes, I think that Regular Expressions info is a good place to start.

This is the Coffeescript code that makes the regex test widget work, being 'chkMatch' and 'show' the two key functions.

        
$ ->
  nullify = ->
    $('#result').css('background', 'pink')
    $('#result').html '<span class= "label label-important">NO MATCH</span>'

  show = (match) ->
    $('#result').css('background', '#eeeeee')
    len = match.length - 1
    html = "#{match[0]} "
    if len > 0
      for n in [1..len]
        if (typeof match[n]) isnt "string"
          postclass = 'label-important'
          groupvalue = 'Null'
        else
    	    if $("#chk-global").attr("checked")
            postclass = 'label-info'
          else
            postclass = 'label-success'
          groupvalue = match[n]
        html += "#{groupvalue} "
    $('#result').html html

  chkMatch = ->
    try
      return nullify() if $('#regex-text').val() is ''
      modifiers = ""
      if $("#chk-global").attr("checked")
        modifiers += "g"
      if $("#chk-insensitive").attr("checked")
        modifiers += "i"
      if $("#chk-multiline").attr("checked")
        modifiers += "m"
      regex = new RegExp $('#regex-text').val().replace(/\\/g, '\\'), modifiers
      stri = $('#string-text').val()
      m = stri.match regex
      return nullify() if not m
      show m

    catch e
      nullify()

  $('#regex-text, #string-text').on 'keyup keypress change blur focus', chkMatch
  $('.modifiers').on 'click', chkMatch
  $('#cboExamples').on 'change click', (ev) ->
    $('#regex-text').val $('#cboExamples').val()
    chkMatch()

  $('.modifiers').css('vertical-align', 'top')

  $('#cboExamples')[0].selectedIndex = -1

  # i = setInterval chkMatch, 200
  chkMatch()