Wie um zu zeigen, ein verstecktes Textfeld, nachdem Sie auf einen link klicken?

Hier ist deine Mühe:

document.getElementById("dThreshold").style.display ="block";

Richtige syntax ist, um enthalten Stil.

Benötigen Sie auch eine Stelle klicken:

<form>
       <input type="button" onclick="show()" value="click here" />
       </form>

Bearbeiten: Wenn Sie nicht mit Hilfe von Jquery, die anderen Kommentare um den Zugriff auf style richtig sind.

Hier ist ein kurzes Beispiel, das Sie verstehen können und nach Ihren Bedürfnissen anpassen:

javascript:

$('#show').click(function(){
    $('input').css('display', 'block');
})

html:

<a href="#" id="show">Click me!</a>
<input type="input" class="input"/>

css:

input {
  display: none;
}

JSFiddle

Während Sie eine Reihe von Antworten bereits, würde ich argumentieren, dass Sie bewegen sollte die JavaScript-außerhalb von HTML und die Verwendung von unobtrusive JavaScript, was würde es Ihnen auch ermöglichen, die Funktion mehr allgemein anwendbar. Mein Erster Vorschlag wäre die Verwendung von DOM-traversal, den passenden zu finden <div> element zu zeigen:

//naming the function, the event argument
//is supplied automatically from the
//EventTarget.addEventListener() method:
function show(event) {

  //stopping the event bubbling (assuming you
  //want to, if not remove the line):
  event.stopPropagation();

  //finding the next element-sibling of the clicked
  //element, and setting the display property of the
  //element's style objects to 'block':
  this.nextElementSibling.style.display = 'block';
}

//creating an array from all the <a> elements with the class
//of 'toggle':    
var toggles = Array.from(document.querySelectorAll('a.toggle'));

//iterating over the Array of elements using
//Array.prototype.forEach():
toggles.forEach(function(toggle) {
  //'toggle' the array-element of the array
  //over which we're iterating.

  //setting the function show() as the
  //event-handler for the 'click' event:
  toggle.addEventListener('click', show);
});

JS:

function show(event) {
  event.stopPropagation();
  this.nextElementSibling.style.display = 'block';
}

var toggles = Array.from(document.querySelectorAll('a.toggle'));

toggles.forEach(function(toggle) {
  toggle.addEventListener('click', show);
});

CSS:

a.toggle {
  display: block;
}

HTML:

<a href="#" class="toggle">Add Deposit Threshold</a>
<div style="display:none">
  <table class="table">
    <tr>
      <td><b>Deposit threshold</b>
      </td>
      <td>
        <div class="row">
          <div class="col-xs-12">
            <input type="text" class="form-control" name="threshold">
          </div>
        </div>
      </td>
    </tr>
  </table>
</div>
<a href="#" class="toggle">Add other details</a>
<div style="display:none">
  <table class="table">
    <tr>
      <td><b>Other details</b>
      </td>
      <td>
        <div class="row">
          <div class="col-xs-12">
            <input type="text" class="form-control" name="other">
          </div>
        </div>
      </td>
    </tr>
  </table>
</div>

JS Fiddle demo.

Jedoch würde es scheinen, mehr Sinn machen, fügen Sie eine toggle-Funktion, anstatt einfach nur ein "show" - Funktion:

function show(event) {
  event.stopPropagation();

  //caching references to those elements/checks we
  //use more than once, to avoid unnecessary DOM
  //look-ups:

  //'self' is the clicked link:
  var self = this,

  //'target' is the next element-sibling (the <div>
  //containing the <table>):
    target = this.nextElementSibling,

  //'check' is the result of assessing if the
  //current display of the 'target' element is
  //'block'; if it is the variable is true, if
  //not then variable is false:
    check = target.style.display === 'block';

  //updating the display, if it is currently set
  //to 'block' we set it to 'none', if it's
  //currently not set to 'block' (so hidden) we
  //set it to 'block' (to show):
  target.style.display = check ? 'none' : 'block';

  //here we add a new class to the clicked element,
  //in order that we can use CSS generated-content
  //to appropriately toggle the link text between
  //'Open' and 'Close' to reflect the action the link
  //will perform:
  self.classList.toggle('open', !check);
}

var toggles = Array.from(document.querySelectorAll('a.toggle'));

toggles.forEach(function(toggle) {
  toggle.addEventListener('click', show);
});

Die über JavaScript in Verbindung mit der folgenden CSS:

a.toggle {
/* to force the <a> elements of class 'toggle'
   to occupy new lines (to minimise the visual
   disturbance of a <div> and its descendant
   <table> suddenly appearing): */
  display: block;
}

a.toggle::before {
/* Setting the 'default' text of the
   relevant <a> elements to be prepended
   with the 'text of 'Open': */
  content: 'Open ';
}

a.toggle.open::before {
  /* Prepending the link, when the <div>
     is shown, with the text 'Close ': */
  content: 'Close ';
}

JS:

//comments to avoid having the JS
//hidden under the panel label 
function show(event) {
  event.stopPropagation();
  var self = this,
    target = this.nextElementSibling,
    check = target.style.display === 'block';
  target.style.display = check ? 'none' : 'block';
  self.classList.toggle('open', !check);
}

var toggles = Array.from(document.querySelectorAll('a.toggle'));

toggles.forEach(function(toggle) {
  toggle.addEventListener('click', show);
});

CSS:

a.toggle {
  display: block;
}
a.toggle::before {
  content: 'Open ';
}
a.toggle.open::before {
  content: 'Close ';
}

HTML:

<a href="#" class="toggle">Deposit Threshold</a>
<div style="display:none">
  <table class="table">
    <tr>
      <td><b>Deposit threshold</b>
      </td>
      <td>
        <div class="row">
          <div class="col-xs-12">
            <input type="text" class="form-control" name="threshold">
          </div>
        </div>
      </td>
    </tr>
  </table>
</div>
<a href="#" class="toggle">other details</a>
<div style="display:none">
  <table class="table">
    <tr>
      <td><b>Other details</b>
      </td>
      <td>
        <div class="row">
          <div class="col-xs-12">
            <input type="text" class="form-control" name="other">
          </div>
        </div>
      </td>
    </tr>
  </table>
</div>

JS Fiddle demo.