실제 해결을 향한 접근법은 다양하겠지만 무조건 공부하셔야 하는 것은 addEventListener()와 toggleAttribute()입니다.

• 체크박스를 해제하면 == "체크박스 해제"라는 "이벤트"가 터지면
• ~ 를 비활성화하고 싶다 == ~ 를 획득하여 disabled 속성을 조작하는 작업을 하고 싶다

제가 짜본 데모에서는 특정 마크업 형식을 강제하도록 해 보았습니다. 이 마크업 규칙을 따르는 한 아무리 많이 복붙해도 각각 독립적으로 잘 돌아갑니다. 왜냐하면 checkboxes가 몇개가 나오건 실제 이벤트 리스너 바인딩은 각각의 checkboxes[i]에 대하여 되고 있기 때문입니다. (그리고 jQuery 버전과 아무 상관없이 순수 바닐라 js로 돌아갑니다.)

참고로... 사실은 $('form').submit()이라는 게 딴게 아니라 <form> 태그에 addEventListener('submit')를 거는 메소드인데요, 다른분이 댓글 달아주셨지만, 이 이벤트가 터지는 시점에 말씀하시는 작업을 하려고 하면 그건 너무 늦을 겁니다.

jQuery 1.12.4 버전으로 테스트한 글입니다.

오지랍#1

$("form").submit(function() {
  // 여기
});

이렇게 작성하면 여기에 해당하는 스크립트는 form 태그에 submit 이벤트가 발생해야만 실행됩니다. 따라서 여기에 이벤트 핸들러를 할당하는 스크립트가 있으면 안됩니다. (정녕 submit 버튼 클릭 후 스크립트 실행을 원하는거면 오지랍#2로 건너뛰세요.)

보통은 다음처럼:

<form>
  <div>
    <input type="text" id="handleMe">
  </div>
</form>
<script>
$('#handleMe').click(handlerFunction);
</script>

원하는 태그 바로 아래에 스크립트가 즉시 실행되게 하거나, 아니면 다음처럼:

<script>
$(document).ready(function() {
  $('#handleMe').click(handlerFunction);
});
</script>
<form>
  <div>
    <input type="text" id="handleMe">
  </div>
</form>

document의 DOM 생성이 끝나는 이벤트에 실행되도록 작성합니다. 이 경우 스크립트의 위치는 상관없죠.

오지랍#2

HTML에서 태그 속성 id는 식별자로 사용됩니다. 즉, 같은 문서 내에 단 하나만 존재할 수 있습니다.

따라서 둘 이상의 태그를 선택하려고 한다면:

myForm.find('input[id="checkbox"]').change(handlerFunction);

이렇게 id로 검색하는 스크립트는 작성하면 안됩니다. id가 같은 태그가 있다고 해서 오류가 뙇 하고 나는것도 아니며, 스크립트도 당장은 잘 되는것처럼 보일 수 있습니다만 차후에 반드시 문제가 됩니다.

대신 아래처럼 작성하세요:

var elements = myForm.find('input'); // 태그로 다수 선택
var elements = myForm.find('input[name="selectMe"]'); // 태그 + 중복 가능한 속성으로 다수 선택

혹은

<input type="text" data-select-me>
<input type="text" data-select-me>
<input type="text" data-select-me>
<script>
var elements = $('[data-select-me]'); // 사용자 정의 속성으로 다수 선택
</script>

결론

그래서 보통 이런식으로 작성합니다:

<form>
    <div>
        <input type="checkbox" id="chk1" name="chk1" checked data-index="1">test
        <input type="text" id="txt1" name="txt1" data-index="1">
    </div>
    <div>
        <input type="checkbox" id="chk2" name="chk2" checked data-index="2">test
        <input type="text" id="txt2" name="txt2" data-index="2">
    </div>
    <div>
        <input type="checkbox" id="chk3" name="chk3" checked data-index="3">test
        <input type="text" id="txt3" name="txt3" data-index="3">
    </div>
</form>
<script>
$('input[type="checkbox"][data-index]').change(function() {
    var $this = $(this);
    var index = $this.attr('data-index'); // .data('index')로 대체 가능
    var $target = $('input[type="text"][data-index="' + index +'"]');
    $target.prop('disabled', $this.is(':checked'));
}).change(); // change(function)으로 핸들러 할당 후 change()로 이벤트 강제 발생시킴
</script>

덧

<b> 태그는 HTML5에서 deprecated 되었으니 font-style CSS로 처리하세요.